/**
 * Cirrusly Coupons - Public Styles
 */

/* BOGO Messages */
.cirrusly-bogo-messages {
  margin: 15px 0;
}

.cirrusly-bogo-message {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: #fff;
  padding: 15px 20px;
  border-radius: 8px;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 12px;
  box-shadow: 0 2px 8px rgba(102, 126, 234, 0.3);
  animation: cirrusly-slide-in 0.3s ease-out;
}

@keyframes cirrusly-slide-in {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.cirrusly-bogo-icon {
  font-size: 1.5em;
  flex-shrink: 0;
}

.cirrusly-bogo-text {
  font-weight: 500;
  font-size: 1.05em;
}

/* BOGO Modal Display */
.cirrusly-bogo-display-modal .cirrusly-bogo-message {
  cursor: pointer;
  transition:
    transform 0.2s,
    box-shadow 0.2s;
}

.cirrusly-bogo-display-modal .cirrusly-bogo-message:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
}

/* BOGO Banner Display */
.cirrusly-bogo-display-banner .cirrusly-bogo-message {
  background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
  box-shadow: 0 2px 8px rgba(245, 87, 108, 0.3);
}

/* Applied BOGO Notice */
.cirrusly-bogo-applied {
  background: #d4edda;
  border-color: #c3e6cb;
  color: #155724;
}

/* Store Credit Notice */
.cirrusly-store-credit-notice {
  background: #fff3cd;
  border-color: #ffeeba;
  color: #856404;
}

/* Gift Card Input */
.cirrusly-gift-card-form {
  background: #f8f9fa;
  padding: 20px;
  border-radius: 8px;
  margin: 20px 0;
}

.cirrusly-gift-card-form label {
  display: block;
  margin-bottom: 8px;
  font-weight: 600;
}

.cirrusly-gift-card-input-wrapper {
  display: flex;
  gap: 10px;
}

.cirrusly-gift-card-form input[type="text"] {
  flex: 1;
  padding: 10px 15px;
  border: 1px solid #ddd;
  border-radius: 4px;
  font-size: 1em;
}

.cirrusly-gift-card-form button {
  padding: 10px 20px;
  background: #0073aa;
  color: #fff;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-weight: 600;
  transition: background 0.2s;
}

.cirrusly-gift-card-form button:hover {
  background: #005a87;
}

.cirrusly-gift-card-form button:disabled {
  background: #ccc;
  cursor: not-allowed;
}

/* Coupon Applied Messages */
.cirrusly-coupon-applied {
  background: #d4edda;
  border: 1px solid #c3e6cb;
  color: #155724;
  padding: 12px 15px;
  border-radius: 4px;
  margin-bottom: 15px;
}

.cirrusly-coupon-error {
  background: #f8d7da;
  border: 1px solid #f5c6cb;
  color: #721c24;
  padding: 12px 15px;
  border-radius: 4px;
  margin-bottom: 15px;
}

/* Loading State */
.cirrusly-loading {
  position: relative;
  pointer-events: none;
}

.cirrusly-loading::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 20px;
  margin: -10px 0 0 -10px;
  border: 2px solid #f3f3f3;
  border-top: 2px solid #0073aa;
  border-radius: 50%;
  animation: cirrusly-spin 1s linear infinite;
}

@keyframes cirrusly-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/* URL Coupon Banner */
.cirrusly-url-coupon-banner {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: #fff;
  padding: 15px 20px;
  text-align: center;
  position: relative;
}

.cirrusly-url-coupon-banner .close-banner {
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  color: #fff;
  font-size: 1.5em;
  cursor: pointer;
  opacity: 0.8;
  transition: opacity 0.2s;
}

.cirrusly-url-coupon-banner .close-banner:hover {
  opacity: 1;
}

/* Tier Display */
.cirrusly-vip-tier {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: #f0f0f0;
  padding: 5px 12px;
  border-radius: 20px;
  font-size: 0.9em;
  font-weight: 500;
}

.cirrusly-vip-tier.bronze {
  background: linear-gradient(135deg, #cd7f32 0%, #e6b17e 100%);
  color: #fff;
}

.cirrusly-vip-tier.silver {
  background: linear-gradient(135deg, #c0c0c0 0%, #e8e8e8 100%);
  color: #333;
}

.cirrusly-vip-tier.gold {
  background: linear-gradient(135deg, #ffd700 0%, #ffed4e 100%);
  color: #333;
}

.cirrusly-vip-tier.platinum {
  background: linear-gradient(135deg, #e5e4e2 0%, #f5f5f5 100%);
  color: #333;
  border: 1px solid #c0c0c0;
}

/* Points Display */
.cirrusly-points-display {
  background: #f8f9fa;
  padding: 15px 20px;
  border-radius: 8px;
  margin: 15px 0;
}

.cirrusly-points-display .points-value {
  font-size: 1.5em;
  font-weight: 600;
  color: #0073aa;
}

.cirrusly-points-display .points-label {
  color: #666;
  font-size: 0.9em;
}

/* Responsive Adjustments */
@media screen and (max-width: 768px) {
  .cirrusly-bogo-message {
    padding: 12px 15px;
    font-size: 0.95em;
  }

  .cirrusly-gift-card-input-wrapper {
    flex-direction: column;
  }

  .cirrusly-gift-card-form button {
    width: 100%;
  }
}