/**
 * Leanfit Trust Badges for Elementor
 * Premium Styling, Glassmorphism, and Hand-crafted Micro-animations
 */

:root {
  --leanfit-primary: #3b82f6;
  --leanfit-primary-rgb: 59, 130, 246;
  --leanfit-card-bg: #ffffff;
  --leanfit-card-border: rgba(229, 231, 235, 0.6);
  --leanfit-title-color: #1f2937;
  --leanfit-desc-color: #6b7280;
  --leanfit-transition-smooth: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  --leanfit-transition-icon: all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* Container & Grid Setup */
.leanfit-badges-container {
  width: 100%;
  box-sizing: border-box;
}

.leanfit-badges-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
  width: 100%;
  box-sizing: border-box;
}

/* Card Base Structure */
.leanfit-badge-card {
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  background-color: var(--leanfit-card-bg);
  border: 1px solid var(--leanfit-card-border);
  border-radius: 16px;
  padding: 24px;
  transition: var(--leanfit-transition-smooth);
  position: relative;
  overflow: hidden;
  height: 100%;
}

/* Glassmorphism Effect */
.leanfit-badge-card.leanfit-glass-effect {
  background-color: rgba(255, 255, 255, 0.45);
  backdrop-filter: blur(16px) saturate(180%);
  -webkit-backdrop-filter: blur(16px) saturate(180%);
  border: 1px solid rgba(255, 255, 255, 0.4);
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.04);
}

.leanfit-badge-card.leanfit-glass-effect:hover {
  background-color: rgba(255, 255, 255, 0.65);
  border: 1px solid rgba(255, 255, 255, 0.6);
  box-shadow: 0 12px 40px 0 rgba(31, 38, 135, 0.08);
}

/* Content Alignments */
.leanfit-align-left .leanfit-badge-card {
  align-items: flex-start;
  text-align: left;
}

.leanfit-align-center .leanfit-badge-card {
  align-items: center;
  text-align: center;
}

.leanfit-align-right .leanfit-badge-card {
  align-items: flex-end;
  text-align: right;
}

/* SVG Icon Base Styling */
.leanfit-badge__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
  transition: var(--leanfit-transition-icon);
  box-sizing: border-box;
}

.leanfit-badge__icon svg {
  display: block;
  width: 48px;
  height: 48px;
  color: var(--leanfit-primary);
  fill: none;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: var(--leanfit-transition-icon);
}

/* Icon Shapes */
.leanfit-icon-shape-circle {
  border-radius: 50%;
  aspect-ratio: 1/1;
}

.leanfit-icon-shape-rounded-soft {
  border-radius: 16px;
}

/* Text Element Styling */
.leanfit-badge__content {
  width: 100%;
}

.leanfit-badge__title {
  font-family: inherit;
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--leanfit-title-color);
  margin: 0 0 8px 0;
  line-height: 1.4;
  transition: color 0.3s ease;
}

.leanfit-badge__desc {
  font-family: inherit;
  font-size: 0.9rem;
  color: var(--leanfit-desc-color);
  margin: 0;
  line-height: 1.5;
  transition: color 0.3s ease;
}

/* ==========================================================================
   ANIMATION VARIATIONS (Hover Animations)
   ========================================================================== */

/* 1. Lift Animation */
.leanfit-anim-lift .leanfit-badge-card:hover {
  transform: translateY(-8px);
}

/* 2. Glow Animation */
.leanfit-anim-glow .leanfit-badge-card:hover {
  box-shadow: 0 10px 30px rgba(var(--leanfit-primary-rgb), 0.12);
  border-color: rgba(var(--leanfit-primary-rgb), 0.35);
}

/* 3. Lift & Glow (Combined Default) */
.leanfit-anim-lift-glow .leanfit-badge-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 16px 36px rgba(var(--leanfit-primary-rgb), 0.12), 0 4px 12px rgba(0, 0, 0, 0.02);
  border-color: rgba(var(--leanfit-primary-rgb), 0.3);
}

/* 4. Pulse Animation */
.leanfit-anim-pulse .leanfit-badge-card:hover {
  transform: scale(1.03);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.05);
}

/* 5. Gelişmiş Cam Efekti & Luxury Shimmer Gleam Sweep */
.leanfit-anim-glass .leanfit-badge-card {
  position: relative;
  overflow: hidden;
}

.leanfit-anim-glass .leanfit-badge-card::after {
  content: '';
  position: absolute;
  top: 0;
  left: -150%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.35),
    transparent
  );
  transform: skewX(-25deg);
  transition: none;
  pointer-events: none;
}

.leanfit-anim-glass .leanfit-badge-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 40px rgba(31, 38, 135, 0.08);
  border-color: rgba(255, 255, 255, 0.6);
}

.leanfit-anim-glass .leanfit-badge-card:hover::after {
  left: 150%;
  transition: all 0.9s cubic-bezier(0.25, 1, 0.5, 1);
}

/* ==========================================================================
   MICRO-INTERACTIVE ICON ANIMATIONS ON HOVER
   ========================================================================== */

/* General Icon Grow Glow on Hover */
.leanfit-icon-glow .leanfit-badge-card:hover .leanfit-badge__icon {
  transform: scale(1.1);
  box-shadow: 0 0 20px rgba(var(--leanfit-primary-rgb), 0.25);
  background-color: rgba(var(--leanfit-primary-rgb), 0.12);
}

/* Shipping Truck Custom Shake & Wheel Wobble on Card Hover */
.leanfit-badge-card:hover .leanfit-svg-shipping {
  animation: leanfit-truck-shake 0.5s ease-in-out infinite alternate;
}

@keyframes leanfit-truck-shake {
  0% { transform: translateY(0) rotate(0); }
  50% { transform: translateY(-1.5px) rotate(-0.5deg); }
  100% { transform: translateY(0) rotate(1deg); }
}

/* Secure Shield Custom Pulse/Scale checkmark on Card Hover */
.leanfit-badge-card:hover .leanfit-svg-secure path:last-child {
  stroke-dasharray: 100;
  stroke-dashoffset: 100;
  animation: leanfit-secure-draw 0.7s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes leanfit-secure-draw {
  to {
    stroke-dashoffset: 0;
  }
}

/* Easy Returns Arrow Rotation on Card Hover */
.leanfit-badge-card:hover .leanfit-svg-returns {
  transform: rotate(-360deg);
  transition: transform 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* 7/24 Müşteri Desteği Headphone Gentle Bobbing on Card Hover */
.leanfit-badge-card:hover .leanfit-svg-support {
  animation: leanfit-support-bob 0.8s ease-in-out infinite alternate;
}

@keyframes leanfit-support-bob {
  0% { transform: translateY(0) scale(1); }
  100% { transform: translateY(-4px) scale(1.04); }
}

/* Original Product Badge Shine/Angle Tilt on Card Hover */
.leanfit-badge-card:hover .leanfit-svg-original {
  transform: translateY(-2px) scale(1.05);
  filter: drop-shadow(0 4px 6px rgba(var(--leanfit-primary-rgb), 0.2));
}

.leanfit-badge-card:hover .leanfit-svg-original circle {
  stroke-dasharray: 100;
  stroke-dashoffset: 100;
  animation: leanfit-secure-draw 0.8s ease forwards;
}

/* ==========================================================================
   RESPONSIVE FALLBACKS
   ========================================================================== */
@media (max-width: 1024px) {
  .leanfit-badges-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
  }
}

@media (max-width: 640px) {
  .leanfit-badges-grid {
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 16px;
  }
  .leanfit-badge-card {
    padding: 20px;
  }
}
