/* Campaign URL Builder tool */

.campaign-builder-page .header h1 { letter-spacing: -0.025em; }

.tool-selector {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem;
  margin-bottom: 2rem;
}

.tool-btn {
  padding: 0.5rem 1rem;
  border-radius: 0.5rem;
  font-size: 0.875rem;
  font-weight: 500;
  border: none;
  cursor: pointer;
  transition: all 0.2s;
  background: #fff;
  color: #718096;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.tool-btn:hover { background: #edf2f7; color: #2d3748; }
.tool-btn.active { color: #fff; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15); }
.tool-btn[data-tool="ga"].active { background: #20293b; }
.tool-btn[data-tool="piwik"].active { background: #10b981; }
.tool-btn[data-tool="etracker"].active { background: #f97316; }
.tool-btn[data-tool="matomo"].active { background: #6366f1; }

.campaign-builder-page .form-group { margin-bottom: 1rem; }

.campaign-builder-page .divider-text { color: #a0aec0; }

.toggle-btn {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  background: none;
  border: none;
  color: #20293b;
  font-size: 0.875rem;
  cursor: pointer;
  padding: 0.5rem 0;
  transition: color 0.2s;
}

.toggle-btn:hover { color: #3d4a63; }
.toggle-btn svg { transition: transform 0.2s; }
.toggle-btn.open svg { transform: rotate(180deg); }

.optional-fields {
  display: none;
  animation: fadeIn 0.2s ease;
}

.optional-fields.show { display: block; }

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.reset-btn {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  background: none;
  border: none;
  color: #718096;
  font-size: 0.875rem;
  cursor: pointer;
  transition: color 0.2s;
}

.reset-btn:hover { color: #2d3748; }

.campaign-builder-page .output-box { min-height: 4rem; }

#open-link:not(.hidden) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.text-ga { color: #20293b; }
.text-piwik { color: #10b981; }
.text-etracker { color: #f97316; }
.text-matomo { color: #6366f1; }