/* =========================
   One Like Prompt Generator
   Naut launcher and prompt generator
   Buttons: #39A6BA
   Text: white
   ========================= */

/* Launcher */
#olpg-launcher {
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 9999999;
  display: flex;
  align-items: flex-end;
  gap: 10px;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

/* Keep the launcher from covering the generator while it is open. */
#olpg-launcher.is-modal-open {
  display: none !important;
}

/* Speech bubble */
.olpg-speech {
  position: relative;
  max-width: 260px;
  background: rgba(255,255,255,0.92);
  border-radius: 16px;
  padding: 12px;
  box-shadow: 0 10px 24px rgba(0,0,0,0.08);
  animation: olpg-blink 7s ease-in-out infinite;
}

/* Hide only the speech bubble (mascot stays visible) */
#olpg-launcher .olpg-speech.is-hidden {
  display: none !important;
}

.olpg-speech::after {
  content: "";
  position: absolute;
  right: 18px;
  bottom: 14px;
  width: 12px;
  height: 12px;
  background: rgba(255,255,255,0.92);
  transform: rotate(45deg);
}

.olpg-speech-title {
  font-weight: 800;
  font-size: 13px;
  color: #0f2a47;
  margin-bottom: 4px;
}

.olpg-speech-text {
  font-size: 12.5px;
  line-height: 1.35;
  color: rgba(15,42,71,0.8);
}

/* Launcher X (visible + clickable) */
#olpg-launcher .olpg-launcher-close {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: absolute !important;
  top: -10px !important;
  right: -10px !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 999px !important;

  background: rgba(255,255,255,0.98) !important;
  color: #0F2A47 !important;

  border: 1px solid rgba(15,42,71,0.18) !important;
  box-shadow: 0 10px 18px rgba(0,0,0,0.12) !important;

  z-index: 99999999 !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  cursor: pointer !important;
  font-size: 18px !important;
  line-height: 1 !important;
}

/* CTA button in bubble */
.olpg-speech-cta {
  margin-top: 10px;
  padding: 11px 14px;
  border-radius: 10px;
  border: 0 !important;
  cursor: pointer;
  background: #39a6ba !important;
  color: #ffffff !important;
  font-weight: 700;
  font-size: 13px;
}

.olpg-speech-cta:hover {
  background: #4fb4c6 !important;
}

/* Mascot */
.olpg-mascot-btn {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  cursor: pointer;
}

.olpg-avatar {
  width: 86px;
  height: auto;
  background: transparent !important;
  border: none !important;
  filter: drop-shadow(0 6px 10px rgba(0,0,0,0.09));
  animation: olpg-float 2.8s ease-in-out infinite;
  transform-origin: 70% 25%;
}

/* Overlay */
#olpg-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.35);
  opacity: 0;
  pointer-events: none;
  transition: opacity .25s ease;
  z-index: 999998;
}

#olpg-overlay.is-open {
  opacity: 1;
  pointer-events: auto;
}

/* Modal */
#olpg-modal {
  position: fixed;
  right: 16px;
  bottom: 16px;
  width: 360px;
  max-width: calc(100vw - 32px);
  max-height: calc(100vh - 24px);
  background: #0c6fa3;
  border-radius: 16px;
  box-shadow: 0 18px 40px rgba(0,0,0,0.18);
  opacity: 0;
  transform: translateY(12px);
  pointer-events: none;
  transition: opacity .25s ease, transform .25s ease;
  z-index: 999999;
}

#olpg-modal.is-open {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

/* Modal header */
.olpg-modal-header {
  padding: 12px;
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid rgba(255,255,255,0.12);
}

.olpg-modal-title {
  color: #ffffff;
  font-weight: 800;
}

.olpg-modal-close {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  border: 0 !important;
  cursor: pointer;
  background: rgba(255,255,255,0.18) !important;
  color: #ffffff !important;
  font-size: 18px;
}

/* Modal body */
.olpg-modal-body {
  padding: 12px;
  overflow-y: auto;
  max-height: calc(100vh - 90px);
}

/* Fields */
.olpg-field {
  margin-bottom: 10px;
}

.olpg-label {
  font-size: 12px;
  font-weight: 800;
  color: rgba(255,255,255,0.95);
  margin-bottom: 6px;
}

.olpg-input,
.olpg-select {
  width: 100%;
  padding: 10px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.28);
  background: rgba(255,255,255,0.14);
  color: #ffffff !important;
  font-size: 13px;
}

.olpg-input::placeholder {
  color: rgba(255,255,255,0.75);
}

.olpg-select option {
  background: #0f2a47;
  color: #ffffff;
}

.olpg-input:focus,
.olpg-select:focus {
  outline: none;
  background: rgba(255,255,255,0.18);
  border-color: rgba(255,255,255,0.55);
}

/* Actions */
.olpg-actions-row {
  display: flex;
  gap: 10px;
  margin: 12px 0;
}

/* Buttons inside modal */
.olpg-generate,
.olpg-copy {
  padding: 11px 14px;
  border-radius: 10px;
  border: 0 !important;
  cursor: pointer;
  font-weight: 700;
  font-size: 13px;
  color: #ffffff !important;
}

/* Generate is the main */
.olpg-generate {
  flex: 1;
  background: #39a6ba !important;
}

/* Copy slightly lighter but still readable */
.olpg-copy {
  background: rgba(57,166,186,0.30) !important;
}

/* Prevent theme overrides */
#olpg-modal button,
#olpg-launcher button {
  text-shadow: none !important;
  filter: none !important;
  opacity: 1 !important;
}

/* Output */
.olpg-textarea {
  width: 100%;
  border-radius: 12px;
  padding: 10px;
  border: 0;
  background: rgba(255,255,255,0.95);
  color: #0f2a47;
  font-size: 13px;
}

.olpg-tip {
  margin-top: 6px;
  font-size: 12px;
  color: rgba(255,255,255,0.85);
}

/* Animations */
@keyframes olpg-float {
  0% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
  100% { transform: translateY(0); }
}

@keyframes olpg-blink {
  0%, 92%, 100% { transform: translateY(0); }
  94% { transform: translateY(1px); }
  96% { transform: translateY(0); }
}

/* Mobile */
@media (max-width: 520px) {
  #olpg-launcher {
    left: 10px;
    right: 10px;
    bottom: 10px;
    justify-content: space-between;
  }

  .olpg-avatar { width: 74px; }

  #olpg-modal {
    left: 10px;
    right: 10px;
    bottom: 10px;
    width: auto;
  }
}

/* Elementor shortcode trigger button */
.olpg-shortcode-button {
  display: inline-block;
  padding: 13px 24px;
  border: 0;
  border-radius: 8px;
  background: #006aa8;
  color: #fff;
  font: inherit;
  font-weight: 600;
  line-height: 1.4;
  cursor: pointer;
  transition: background .2s ease;
}
.olpg-shortcode-button:hover, .olpg-shortcode-button:focus-visible { background: #0f2a47; color: #fff; }

/* Master prompt mode */
#olpg-pm-fields[hidden], #olpg-general-fields[hidden] { display:none !important; }
.olpg-pm-intro { margin:0 0 16px; line-height:1.5; }
#olpg-pm-back { margin: 0 0 14px; cursor:pointer; }

#olpg-master-fields[hidden] { display:none !important; }

/* v1.4.1: compact white-outline master prompt trigger buttons */
.olpg-shortcode-button,
button.olpg-shortcode-button {
  display: inline-flex !important;
  width: fit-content !important;
  max-width: 100% !important;
  min-width: 0 !important;
  flex: 0 0 auto !important;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  padding: 12px 20px !important;
  border: 2.5px solid #fff !important;
  border-radius: 20px !important;
  background: transparent !important;
  color: #fff !important;
  font: inherit;
  font-weight: 600 !important;
  line-height: 1.4;
  text-align: center;
  white-space: normal;
  box-shadow: none !important;
  cursor: pointer;
}
.olpg-shortcode-button:hover,
.olpg-shortcode-button:focus-visible {
  background: rgba(255,255,255,.12) !important;
  border-color: #fff !important;
  color: #fff !important;
}
@media (max-width: 480px) {
  .olpg-shortcode-button { padding: 10px 16px !important; }
}