/**

 * 🧙‍♂️ Kurulum Asistanı - Full Screen Wizard Styles

 */



/* Full Screen Overlay */

#setup-wizard-overlay {

  position: fixed;

  top: 0;

  left: 0;

  width: 100vw;

  height: 100vh;

  z-index: 99999;

  overflow: hidden;

}



/* Gradient Background */

.wizard-background {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);

  animation: gradientShift 15s ease infinite;

}



/* Gradient Animation */

@keyframes gradientShift {

  0% {

    background-position: 0% 50%;

  }

  50% {

    background-position: 100% 50%;

  }

  100% {

    background-position: 0% 50%;

  }

}



/* Content Container */

.wizard-content {

  position: relative;

  z-index: 1;

  color: white;

}



/* Typewriter Text */

#typewriter-text {

  color: white;

  text-shadow: 0 2px 20px rgba(0, 0, 0, 0.3);

  min-height: 120px;

  display: flex;

  align-items: center;

  justify-content: center;

}



/* Card Styles */

.wizard-step .uk-card {

  background: rgba(255, 255, 255, 0.95);

  backdrop-filter: blur(10px);

  border-radius: 16px;

  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);

}



.wizard-step .uk-card-title {

  color: #667eea;

  font-weight: bold;

}



/* Form Inputs */

.wizard-step .uk-input {

  border-radius: 8px;

  border: 2px solid #e5e5e5;

  transition: border-color 0.3s;

}



.wizard-step .uk-input:focus {

  border-color: #667eea;

  outline: none;

}



/* Buttons */

.wizard-step .uk-button-primary {

  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);

  border: none;

  border-radius: 8px;

  font-weight: bold;

  transition: transform 0.2s, box-shadow 0.2s;

}



.wizard-step .uk-button-primary:hover {

  transform: translateY(-2px);

  box-shadow: 0 10px 30px rgba(102, 126, 234, 0.4);

}



/* Installation Guide Placeholder */

.installation-guide-placeholder {

  background: rgba(255, 255, 255, 0.1);

  color: rgba(255, 255, 255, 0.6);

  font-size: 18px;

}



/* Progress Bar */

#integration-progress {

  height: 30px;

  border-radius: 15px;

  background: rgba(255, 255, 255, 0.2);

}



#integration-progress::-webkit-progress-value {

  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);

  border-radius: 15px;

  transition: width 0.5s ease;

}



#integration-progress::-moz-progress-bar {

  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);

  border-radius: 15px;

  transition: width 0.5s ease;

}



/* Progress Messages */

#progress-messages p {

  margin: 8px 0;

  padding: 12px;

  background: rgba(255, 255, 255, 0.1);

  border-radius: 8px;

  animation: slideIn 0.3s ease;

}



@keyframes slideIn {

  from {

    opacity: 0;

    transform: translateX(-20px);

  }

  to {

    opacity: 1;

    transform: translateX(0);

  }

}



/* Fade Animations */

.wizard-step {

  animation: fadeIn 0.5s ease;

}



@keyframes fadeIn {

  from {

    opacity: 0;

    transform: scale(0.95);

  }

  to {

    opacity: 1;

    transform: scale(1);

  }

}



/* Spinner Customization */

.wizard-step .uk-spinner > * {

  border-top-color: white;

}



/* Download Button Special */

.wizard-step .uk-button-large {

  padding: 16px 32px;

  font-size: 18px;

}



/* Responsive */

@media (max-width: 768px) {

  #typewriter-text {

    font-size: 28px !important;

  }

  

  .uk-card {

    margin: 0 20px;

  }

  

  .installation-guide-placeholder {

    width: 100% !important;

    height: 300px !important;

  }

}