/* ============================================================================  
 * 6.2a – Docs Manager Spinner Animation  
 * =========================================================================== */
@keyframes mygpt-spin {
  to { transform: rotate(360deg); }
}
.mygpt-spinner-circle {
  display: inline-block;
  width: 24px;
  height: 24px;
  border: 3px solid #ccc;
  border-top-color: #333;
  border-radius: 50%;
  animation: mygpt-spin 1s linear infinite;
}

/* ============================================================================  
 * 6.2a – Docs Manager Delete-Button Styles  
 * =========================================================================== */
.doc-delete {
  background: #ffe0cc;     /* orange block */
  color: #fff !important;  /* bright “X” */
  font-weight: bold;
}
.doc-delete:hover {
  background: #FEC991;     /* darker on hover */
}

/* ============================================================================  
 * 6.4  – Logs Screen Button Styles  
 * =========================================================================== */
.mygpt-log-buttons {
  margin-bottom: 1em;
}
.mygpt-log-buttons .button {
  margin-right: 0.75em;
  background: #ffe0b3;
  border-color: #ffcc99;
  color: #333;
}
.mygpt-log-buttons .button:hover {
  background: #ffcc99;
}

/* ============================================================================  
 * 6.7.4 – Icon Selector Thumbnails  
 * =========================================================================== */
#icon_choice_select option {
  padding-left: 30px;
  background-repeat: no-repeat;
  background-position: 5px center;
}

/* Chatbot icon thumbnails */
#icon_choice_select option[value="https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-blank.png"] {
  background-image: url(https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-blank.png);
}
#icon_choice_select option[value="https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-turquoise.png"] {
  background-image: url(https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-turquoise.png);
}
#icon_choice_select option[value="https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-pink.png"] {
  background-image: url(https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-pink.png);
}
#icon_choice_select option[value="https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-light-orange.png"] {
  background-image: url(https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-light-orange.png);
}
#icon_choice_select option[value="https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-light-green.png"] {
  background-image: url(https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-light-green.png);
}
#icon_choice_select option[value="https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-light-gray.png"] {
  background-image: url(https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-light-gray.png);
}
#icon_choice_select option[value="https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-light-blue.png"] {
  background-image: url(https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-light-blue.png);
}
#icon_choice_select option[value="https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-lavender.png"] {
  background-image: url(https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-lavender.png);
}
#icon_choice_select option[value="https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-cream.png"] {
  background-image: url(https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-cream.png);
}
#icon_choice_select option[value="https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-black.yellow.png"] {
  background-image: url(https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-black.yellow.png);
}
#icon_choice_select option[value="https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-black.white_.png"] {
  background-image: url(https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-black.white_.png);
}
#icon_choice_select option[value="https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-Black.red_.png"] {
  background-image: url(https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-Black.red_.png);
}
#icon_choice_select option[value="https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-black.purple.png"] {
  background-image: url(https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-black.purple.png);
}
#icon_choice_select option[value="https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-black.orange.png"] {
  background-image: url(https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-black.orange.png);
}
#icon_choice_select option[value="https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-black.hot_pink.png"] {
  background-image: url(https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-black.hot_pink.png);
}
#icon_choice_select option[value="https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-black.green_.png"] {
  background-image: url(https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-black.green_.png);
}
#icon_choice_select option[value="https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-black.chartreuse.png"] {
  background-image: url(https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-black.chartreuse.png);
}
#icon_choice_select option[value="https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-black.blue_.png"] {
  background-image: url(https://glotreesolutions.com/wp-content/uploads/2025/06/Chatbot-black.blue_.png);
}

/* ============================================================================  
 * 6.7.4a – Icon Selector Base Styles  
 * =========================================================================== */
#icon_choice_select {
  width: 260px;
  margin-bottom: 12px;
  background-color: #fff;
  color: #000;
}
#icon_preview {
  height: 32px;
  vertical-align: middle;
  margin-left: 8px;
}
