/* =========================================================
   AI CLEANING TOOLS – FINAL BOX STYLE
   ========================================================= */

.ai-search-wrap,
.ai-search-wrap * {
  box-sizing: border-box !important;
  font-family: Arial, sans-serif !important;
}

/* =========================================================
   MAIN CONTAINER
   ========================================================= */
.ai-search-wrap {
  max-width: 1100px !important;
  margin: 40px auto !important;
  padding: 40px 24px !important;
  background: #f3f7ff !important;
  border: 1px solid #d8e3ff !important;
  border-radius: 0 !important; /* ❌ NO ROUNDED */
}

/* =========================================================
   INPUT (BIG BOX)
   ========================================================= */
#aict-generator-input {
  width: 100% !important;
  min-height: 140px !important;
  border: 1px solid #cfd8ee !important;
  border-radius: 0 !important; /* ❌ NO ROUNDED */
  padding: 18px !important;
  font-size: 16px !important;
  resize: vertical !important;
  outline: none !important;
  background: #ffffff !important;
  color: #202124 !important;
}

#aict-generator-input::placeholder {
  color: #6b7280 !important;
}

/* =========================================================
   BUTTON (BOTTOM – CENTER)
   ========================================================= */
#aict-generator-btn {
  display: block !important;
  margin: 24px auto 0 auto !important;
  width: 100% !important;
  max-width: 420px !important;
  padding: 16px 24px !important;
  font-size: 18px !important;
  border: none !important;
  border-radius: 0 !important; /* ❌ NO ROUNDED */
  background: #2f5fe3 !important;
  color: #ffffff !important;
  cursor: pointer !important;
  text-align: center !important;
}

#aict-generator-btn:hover {
  background: #244ccc !important;
}

/* =========================================================
   AI OVERVIEW RESULT (BIG CARD)
   ========================================================= */
.ai-overview-card {
  width: 100% !important;
  margin-top: 32px !important;
  padding: 32px !important;
  background: #ffffff !important;
  border-radius: 0 !important; /* ❌ NO ROUNDED */
  border: 1px solid #e5e7eb !important;
  box-shadow: 0 12px 30px rgba(0,0,0,0.15) !important;
}

.ai-overview-title {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #5f6368 !important;
  margin-bottom: 16px !important;
  text-transform: uppercase !important;
}

.ai-overview-content {
  font-size: 16px !important;
  line-height: 1.8 !important;
  color: #202124 !important;
  white-space: pre-wrap !important;
}

/* CODE BLOCKS */
.ai-overview-content pre,
.ai-overview-content code {
  background: #f6f8fa !important;
  padding: 14px !important;
  border-radius: 0 !important;
  display: block !important;
  overflow-x: auto !important;
}

/* =========================================================
   ERROR MESSAGE
   ========================================================= */
.ai-error {
  margin-top: 16px !important;
  color: #d93025 !important;
  font-weight: 700 !important;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width: 768px) {
  .ai-search-wrap {
    padding: 24px 16px !important;
  }

  #aict-generator-input {
    min-height: 120px !important;
  }

  #aict-generator-btn {
    width: 100% !important;
  }

  .ai-overview-card {
    padding: 24px !important;
  }
}





/* Heading + Subheading */
.aict-hero {
  text-align: center !important;
  margin-bottom: 30px !important;
}

.aict-title {
  font-size: 36px !important;
  font-weight: 800 !important;
  color: #1f2937 !important;
  margin-bottom: 12px !important;
}

.aict-subtitle {
  font-size: 16px !important;
  color: #4b5563 !important;
  max-width: 760px !important;
  margin: 0 auto !important;
}