/* tools.css — uzupełnienie dla g_styles.css, style narzędziowe */

/* Ulepszenia dla edytora <pre> */
textarea {
  width: 100%;
  min-height: 8rem;
  background: var(--surface-2);
  color: #e6eef6;
  border: 1px solid rgba(255, 255, 255, 0.05);
  border-radius: 0.5rem;
  padding: 0.5rem;
  resize: vertical;
}

input[type="text"] {
  width: 100%;
  background: var(--surface-2);
  color: #e6eef6;
  border: 1px solid rgba(255, 255, 255, 0.05);
  border-radius: 0.5rem;
  padding: 0.4rem;
}

button.btn.pre-btn {
  background: var(--accent-2);
  color: #031018;
  margin: 0.25rem;
  transition: all 0.15s ease;
}

button.btn.pre-btn:hover {
  filter: brightness(1.1);
  transform: scale(1.03);
}

#editor label {
  font-weight: 600;
  font-size: 0.95rem;
}

#editor {
  animation: fadeIn 0.2s ease;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Pomocnicze */
#buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.5rem;
}

  /* Minimalne style lokalne (możesz przenieść do tools.css) */
.image-wrap { 
  position:relative; 
  display:inline-block; 
  max-width:100vmin; 
  max-height:100vmin; 
  background:var(--surface-1); 
  border-radius:6px; 
  overflow:hidden; 
}

.image-wrap img { 
  display:block; 
  max-width:100%; 
  height:auto; 
  user-select:none; 
  -webkit-user-drag:none; 
}

.svg-overlay { 
  position:absolute; 
  left:0; 
  top:0; 
  width:100%; 
  height:100%; 
  pointer-events:none; 
}

.svg-button-group { 
  pointer-events:all; 
  cursor:pointer; 
}

.svg-button-bg { 
  transition:stroke .12s; 
}

.card.small { 
  margin-bottom:0.75rem; 
}

.kv { 
  display:flex; 
  gap:0.6rem; 
  align-items:center; 
}

label { 
  min-width:5rem; 
  font-weight:600; 
}

textarea.output { 
  min-height:6rem; 
  font-family:monospace; 
  resize:vertical; 
}

.controls { 
  display:flex; 
  gap:0.5rem; 
  flex-wrap:wrap; 
}

.btn { 
  all:unset; 
  cursor:pointer; 
  padding:0.4rem 0.7rem; 
  border-radius:6px; 
  background:var(--accent-2); 
  color:#031018; 
  font-weight:700; 
}