/**
 * RecordX SVG Animation Styles
 * Base styles for animated SVG illustrations
 */ /* SVG Animation Styles */

/* Base SVG setup */
.rx-animated-svg {
  width: 100%;
  max-width: 300px;
  height: auto;
  overflow: visible;
  display: block;
}

/* Fallback: keep SVGs readable if animation JS is unavailable */
.rx-no-anim .rx-animated-svg .draw-line,
.rx-no-anim #rx-transcribe .doc-frame,
.rx-no-anim #rx-actions .checkmark,
.rx-no-anim #rx-track-actions .checkmark,
.rx-no-anim #rx-track-actions .progress-arc,
.rx-no-anim #rx-track-complete .big-check,
.rx-no-anim #rx-cloud-safe .shield-check,
.rx-no-anim #rx-control .badge-check,
.rx-no-anim #rx-privacy .shield-check {
  stroke-dashoffset: 0 !important;
}

.rx-no-anim #rx-transcribe .text-line,
.rx-no-anim #rx-actions .checkbox,
.rx-no-anim #rx-actions .task-line,
.rx-no-anim #rx-track-actions .checkbox,
.rx-no-anim #rx-track-actions .task-line {
  transform: none !important;
  opacity: 1 !important;
}

.rx-no-anim #rx-transcribe .flow-arrow,
.rx-no-anim #rx-transcribe .arrow-head,
.rx-no-anim #rx-structured-notes .profile-avatar,
.rx-no-anim #rx-structured-notes .note-block,
.rx-no-anim #rx-structured-notes .rating-star,
.rx-no-anim #rx-structured-notes .avatar-reflection,
.rx-no-anim #rx-structured-notes .ambient-particle,
.rx-no-anim #rx-structured-notes .corner-flourish,
.rx-no-anim #rx-track-complete .calendar-date,
.rx-no-anim #rx-encryption .lock-glow,
.rx-no-anim #rx-cloud-safe .shield-pulse,
.rx-no-anim #rx-cloud-safe .sparkle,
.rx-no-anim #rx-control .item-highlight,
.rx-no-anim #rx-control .dust,
.rx-no-anim #rx-control .success-badge,
.rx-no-anim #rx-privacy .secure-doc,
.rx-no-anim #rx-search .search-cursor,
.rx-no-anim #rx-search .found-quote-bg,
.rx-no-anim #rx-search .quote-badge {
  opacity: 1 !important;
}

.rx-animated-svg .draw-line {
  /* fill: none;  Removed to allow HTML fill attributes */
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
}

/* Initial States */
#rx-transcribe .doc-frame {
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
}

#rx-transcribe .text-line {
  opacity: 0;
  transform-box: fill-box;
  transform-origin: left center;
  transform: scaleX(0);
}

#rx-transcribe .wave-bar {
  transform-box: fill-box;
  transform-origin: center;
}

#rx-transcribe .flow-arrow,
#rx-transcribe .arrow-head {
  opacity: 0;
}

#rx-actions .checkbox,
#rx-actions .task-line {
  transform: scale(0);
}

#rx-actions .checkmark {
  stroke-dashoffset: 1000;
}

/* New Animations Initial States */
#rx-record .pulse-ring {
  transform-origin: 90px 100px;
}

/* Record Animation - Premium luxury micro-details */
#rx-record .mic-ambient-glow {
  transform-box: fill-box;
  transform-origin: center;
}

#rx-record .mic-highlight {
  transform-box: fill-box;
  transform-origin: center;
}

#rx-record .stand-reflection {
  transform-box: fill-box;
  transform-origin: center;
}

#rx-record .rec-dot {
  transform-box: fill-box;
  transform-origin: center;
}

#rx-record .sound-particle {
  transform-box: fill-box;
  transform-origin: center;
}

#rx-record .file-shimmer {
  pointer-events: none;
}

#rx-record .arrow-glow-trail {
  transform-box: fill-box;
  transform-origin: center bottom;
}

#rx-record .upload-sparkle {
  transform-box: fill-box;
  transform-origin: center;
}

#rx-record .progress-dot {
  transform-box: fill-box;
  transform-origin: center;
}

#rx-track-actions .checkbox {
  transform-box: fill-box;
  transform-origin: center;
  transform: scale(0);
}

#rx-track-actions .task-line {
  transform-box: fill-box;
  transform-origin: left center;
  transform: scaleX(0);
}

#rx-track-actions .checkmark {
  stroke-dasharray: 100;
  stroke-dashoffset: 100;
}

#rx-track-actions .progress-arc {
  stroke-dasharray: 157;
  stroke-dashoffset: 157;
}

#rx-structured-notes .profile-avatar,
#rx-structured-notes .note-block,
#rx-structured-notes .rating-star {
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
}

/* Recruiting Animation - Premium luxury micro-details */
#rx-structured-notes .avatar-outer-ring {
  transform-box: fill-box;
  transform-origin: center;
}

#rx-structured-notes .avatar-reflection {
  opacity: 0;
}

#rx-structured-notes .gold-accent {
  transform-box: fill-box;
  transform-origin: left center;
}

#rx-structured-notes .shimmer-overlay {
  pointer-events: none;
}

#rx-structured-notes .ambient-particle {
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
}

#rx-structured-notes .badge-pulse {
  transform-box: fill-box;
  transform-origin: center;
}

#rx-structured-notes .corner-flourish {
  opacity: 0;
}

#rx-track-complete .calendar-date {
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
}

#rx-track-complete .big-check {
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
}

/* Privacy Section Animations */

/* End-to-end Encryption */
#rx-encryption .lock-glow {
  opacity: 0;
}

#rx-encryption .packet {
  transform-box: fill-box;
  transform-origin: center;
}

#rx-encryption .send-dot,
#rx-encryption .receive-dot {
  transform-box: fill-box;
  transform-origin: center;
}

/* Secure Cloud Storage */
#rx-cloud-safe .server-led {
  transform-box: fill-box;
  transform-origin: center;
}

#rx-cloud-safe .led-amber {
  transform-box: fill-box;
  transform-origin: center;
}

#rx-cloud-safe .server-row {
  transform-box: fill-box;
  transform-origin: center;
}

#rx-cloud-safe .shield-pulse {
  opacity: 0;
}

#rx-cloud-safe .shield-check {
  stroke-dasharray: 40;
  stroke-dashoffset: 40;
}

#rx-cloud-safe .sparkle {
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
}

/* You own your data (Eraser List) */
#rx-control .list-item {
  transform-box: fill-box;
  transform-origin: center;
}

#rx-control .item-highlight {
  opacity: 0;
}

#rx-control .eraser {
  transform-box: fill-box;
  transform-origin: center bottom;
}

#rx-control .dust {
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
}

#rx-control .success-badge {
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
}

#rx-control .badge-check {
  stroke-dasharray: 60;
  stroke-dashoffset: 60;
}

/* New Privacy Animation States */
#rx-privacy .secure-doc {
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
}

#rx-privacy .shield-check {
  stroke-dasharray: 100;
  stroke-dashoffset: 100;
}

#rx-privacy .lock-dial {
  transform-box: fill-box;
  transform-origin: center;
}

/* Search (Interview searchable) */
#rx-search .wave-bar {
  transform-box: fill-box;
  transform-origin: center;
}

#rx-search .playhead {
  transform-box: fill-box;
}

#rx-search .search-cursor {
  opacity: 0;
}

#rx-search .found-quote-bg {
  opacity: 0;
}

#rx-search .quote-badge {
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
}

/* Dark mode adjustments */
@media (prefers-color-scheme: light) {
  .rx-animated-svg {
    --rx-primary: #2563eb;
    --rx-success: #059669;
  }
}
