/* Alat: Uredi PDF (uz pdf.css) */

.dok-gumbi { display: grid; gap: 0.5rem; margin: 0.85rem 0 0.6rem; }
.dok-gumbi .btn-outline { width: 100%; min-height: 2.6rem; padding-block: 0.45rem; }
.step > .btn-text { margin-top: 0.4rem; }

/* Izbor alata */
.alati-izbor {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 3px;
  margin: 0; padding: 3px; border: 0;
  background: var(--surface-2); border-radius: 10px;
}
.alati-izbor label { position: relative; cursor: pointer; }
.alati-izbor input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.alati-izbor span {
  display: block; text-align: center; padding: 0.5rem 0.15rem; border-radius: 8px;
  font-weight: 600; font-size: 0.92rem; color: var(--ink-soft);
}
.alati-izbor label:hover span { color: var(--ink); }
.alati-izbor input:checked + span { background: var(--surface); color: var(--pen); box-shadow: 0 1px 2px rgba(20, 32, 70, 0.12); }
.alati-izbor input:focus-visible + span { outline: 3px solid color-mix(in srgb, var(--pen) 60%, transparent); outline-offset: 1px; }
.alat-uputa { margin-top: 0.7rem; font-size: 0.92rem; color: var(--ink-soft); min-height: 2.6em; }

.tekst-postavke { display: grid; gap: 0.85rem; margin-top: 0.85rem; }
.tekst-velicina { grid-template-columns: auto 1fr; align-items: center; gap: 0.75rem; }
.tekst-velicina select {
  min-height: 2.5rem; padding: 0.35rem 0.6rem;
  border: 1px solid var(--line-strong); border-radius: 8px; background: var(--surface); color: var(--ink);
}
.swatch-red { background: #c62828; }

/* Traka iznad svake stranice */
.stranica-alati { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.4rem 1rem; margin-bottom: 0.55rem; }
.stranica-oznaka { font-size: 0.92rem; font-weight: 650; color: var(--ink-soft); }
.stranica-gumbi { display: flex; gap: 0.3rem; }
.str-gumb {
  display: grid; place-items: center; width: 2.3rem; height: 2.3rem; padding: 0;
  border: 1px solid var(--line-strong); border-radius: 8px; background: var(--surface); color: var(--ink);
  cursor: pointer;
}
.str-gumb svg { width: 1.1rem; height: 1.1rem; }
.str-gumb:hover:not(:disabled) { color: var(--pen); border-color: var(--pen); }
.str-gumb:disabled { opacity: 0.35; cursor: not-allowed; }
.str-gumb.str-obrisi:hover { color: var(--red); border-color: var(--red); }

/* Kursor i dodir prema alatu */
.pages[data-alat="tekst"] .page, .pages[data-alat="tekst"] .oznaka-prekrij, .pages[data-alat="tekst"] .oznaka-istakni { cursor: text; }
.pages[data-alat="prekrij"] .page, .pages[data-alat="istakni"] .page { cursor: crosshair; touch-action: none; }

/* Prekrij i Istakni */
.oznaka-prekrij { background: #fff; outline: 1px dashed #9aa4b8; outline-offset: 0; }
.oznaka-prekrij.is-selected, .oznaka-istakni.is-selected { outline: 1.5px dashed #1f3a9e; outline-offset: 1px; }
.oznaka-istakni { background: #ffe04d; mix-blend-mode: multiply; }
.oznaka-prekrij .resize-handle, .oznaka-istakni .resize-handle { right: -8px; bottom: -8px; }

/* Dodani tekst */
.oznaka-tekst {
  transform: translateY(-50%); white-space: nowrap; line-height: 1.3;
  cursor: text; user-select: auto; -webkit-user-select: auto;
}
.oznaka-tekst input {
  display: block; height: 1.3em; min-width: 0.5em; margin: 0; padding: 0;
  border: 0; background: transparent; outline: none;
  font-family: "Dokument Sans", Arial, sans-serif; font-size: inherit; line-height: 1.3;
}
.oznaka-tekst input::placeholder { color: #8a93a8; }
.oznaka-tekst.is-selected { outline: 1.5px dashed #1f3a9e; outline-offset: 2px; }
.tekst-rucka {
  position: absolute; right: 100%; top: 50%; transform: translateY(-50%); margin-right: 6px;
  display: none; place-items: center; width: 22px; height: 26px; padding: 0;
  border: 1px solid #b9c3d7; border-radius: 6px; background: #fff; color: #18213a;
  cursor: move; touch-action: none;
}
.tekst-rucka svg { width: 14px; height: 14px; }
.oznaka-tekst.is-selected .tekst-rucka { display: grid; }
@media (pointer: coarse) { .tekst-rucka { width: 30px; height: 34px; } }
.oznaka-tekst .placed-tools { margin-bottom: 10px; }
.oznaka-tekst.tools-below .placed-tools { margin-top: 12px; }
