/**
 * JE Solar — Additional / component styles
 * Core design system lives in style.css
 */

/* Smooth image loading */
img {
  transition: opacity 0.4s ease;
}

/* Focus visible for a11y */
:focus-visible {
  outline: 2px solid var(--je-primary, #0EA5E9);
  outline-offset: 3px;
}

.je-btn:focus-visible {
  outline-offset: 4px;
}

/* Selection */
::selection {
  background: rgba(14, 165, 233, 0.2);
  color: var(--je-dark, #0F172A);
}

/* Custom scrollbar */
@media (min-width: 769px) {
  ::-webkit-scrollbar {
    width: 10px;
  }
  ::-webkit-scrollbar-track {
    background: #f1f5f9;
  }
  ::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #0EA5E9, #14B8A6);
    border-radius: 10px;
    border: 2px solid #f1f5f9;
  }
}

/* Energy wave divider */
.je-divider-wave {
  position: relative;
  height: 60px;
  overflow: hidden;
  margin: -1px 0;
}

.je-divider-wave svg {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* Glow on hover for interactive cards */
.je-service-card:hover .je-service-icon span,
.je-service-full-card:hover .je-service-icon span {
  transform: scale(1.1);
  display: inline-block;
  transition: transform 0.35s ease;
}

/* Service full card image overlay */
.je-service-full-img::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(14, 165, 233, 0.15) 0%, rgba(20, 184, 166, 0.1) 100%);
  z-index: 1;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.35s ease;
}

.je-service-full-card:hover .je-service-full-img::after {
  opacity: 1;
}

.je-service-full-img .fallback-icon {
  position: relative;
  z-index: 0;
}

/* Team avatar glow ring */
.je-team-card:hover .je-team-avatar {
  box-shadow: 0 8px 30px rgba(14, 165, 233, 0.45), 0 0 0 6px rgba(14, 165, 233, 0.12);
}

/* Floating WhatsApp tooltip on desktop */
@media (min-width: 769px) {
  .je-whatsapp-float::after {
    content: 'Chat with us';
    position: absolute;
    right: 70px;
    top: 50%;
    transform: translateY(-50%) translateX(10px);
    background: #128C7E;
    color: #fff;
    padding: 0.4rem 0.85rem;
    border-radius: 8px;
    font-size: 0.8rem;
    font-weight: 600;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: all 0.3s ease;
    font-family: var(--je-font-display, Inter, sans-serif);
  }

  .je-whatsapp-float:hover::after {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
  }
}

/* Reduce motion preference */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  .je-reveal,
  .je-reveal-left,
  .je-reveal-right {
    opacity: 1;
    transform: none;
  }
}

/* WordPress admin bar offset */
.admin-bar .je-header {
  top: 32px;
}

@media (max-width: 782px) {
  .admin-bar .je-header {
    top: 46px;
  }
}

/* Block editor front-end alignment polish */
.wp-block-button__link {
  border-radius: 9999px !important;
}

.wp-block-group.has-background {
  border-radius: 16px;
  padding: 2rem;
}

/* Entry content lists */
.entry-content ul {
  list-style: disc;
  padding-left: 1.5rem;
  margin-bottom: 1.25rem;
}

.entry-content ol {
  list-style: decimal;
  padding-left: 1.5rem;
  margin-bottom: 1.25rem;
}

.entry-content li {
  margin-bottom: 0.4rem;
}

.entry-content a {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.entry-content blockquote {
  border-left: 4px solid var(--je-primary, #0EA5E9);
  padding: 1rem 1.5rem;
  margin: 1.5rem 0;
  background: rgba(14, 165, 233, 0.05);
  border-radius: 0 12px 12px 0;
  font-style: italic;
  color: var(--je-gray-600, #4B5563);
}