/* onlyprint PDF-Tool
 *
 * Orientiert sich am Look der Produktseiten (Panel "Produkt konfigurieren"):
 * umrandetes Panel, graue Kopfzeile in kursiven Versalien, Zeilen durch feine
 * Linien getrennt, Label links normal geschrieben, Bedienelement rechts.
 *
 * Schrift wird bewusst NICHT gesetzt: das Modul erbt sie vom Theme (Oxygen).
 * Farben zentral als Variablen - Rebranding geht an einer Stelle.
 */
#onlyprint_pdftool {
  --op-green: #afcb31;
  --op-green-dark: #9cb62a;
  --op-green-soft: #f5f9e6;
  --op-ink: #333333;
  --op-muted: #7a7a7a;
  --op-line: #dcdcdc;
  --op-panel-head: #f2f2f2;
  --op-grey-hover: #7f7f7f;   /* Hover der Shop-Buttons */
  --op-danger: #b03a3a;

  max-width: 900px;
  /* Zentriert im Inhaltsbereich. Ohne die automatischen Seitenraender klebt
     der Block auf breiten Bildschirmen links, waehrend das Theme die
     Seitenueberschrift mittig setzt - das sieht wie ein Fehler aus. */
  margin-left: auto;
  margin-right: auto;
  color: var(--op-ink);
  /* Themes setzen im Inhaltsbereich gern text-align:center - dann starten
     z.B. die drei Skalierungs-Optionen je nach Textlaenge unterschiedlich
     weit rechts statt buendig untereinander. */
  text-align: left;
}

#onlyprint_pdftool .opdf-intro { color: var(--op-muted); margin-bottom: 1.5rem; }

/* ---------------------------------------------------------- Ablagebereich */
.opdf-drop {
  border: 1px dashed var(--op-line); padding: 2.5rem 1rem;
  /* hier ist Zentrierung gewollt */
  text-align: center; cursor: pointer; background: #fafafa;
  transition: border-color .15s, background .15s;
}
.opdf-drop:hover, .opdf-drop:focus, .opdf-drop.opdf-over {
  border-color: var(--op-green); background: var(--op-green-soft); outline: none;
}
.opdf-drop-title {
  display: block; font-weight: 700; font-style: italic; font-size: 1.05rem;
  text-transform: uppercase;
}
.opdf-drop-sub { display: block; color: var(--op-muted); font-size: .875rem; margin-top: .25rem; }

/* ------------------------------------------------------------ Sortierleiste */
.opdf-toolbar {
  display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin-top: 1.25rem;
}
.opdf-toolbar-label { color: var(--op-muted); font-size: .9rem; margin-right: .25rem; }
.opdf-toolbar button {
  border: 1px solid var(--op-line); background: #fff;
  padding: .35rem .8rem; font-size: .875rem; cursor: pointer; color: var(--op-ink);
  transition: border-color .12s, background .12s;
}
.opdf-toolbar button:hover { background: var(--op-green-soft); border-color: var(--op-green); }

/* ------------------------------------------------------------- Dateiliste */
.opdf-list { list-style: none; margin: .75rem 0 0; padding: 0; }
.opdf-item {
  display: flex; align-items: center; gap: .75rem;
  padding: .55rem; border: 1px solid var(--op-line);
  margin-bottom: -1px; background: #fff; cursor: grab;
}
.opdf-item:hover { background: #fafafa; }
.opdf-item.opdf-dragging { opacity: .45; }

.opdf-pos {
  flex: 0 0 1.75rem; height: 1.75rem; border-radius: 50%;
  background: var(--op-green); color: #fff;
  font-size: .8rem; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
}
/* DIN-Seitenverhaeltnis (1:racine2) statt Quadrat - gedruckt wird ohnehin nur
   DIN, ein quadratischer Kasten wuerde jede Seite falsch andeuten.
   Kein Rahmen: die Seite bringt ihren eigenen weissen Rand mit. */
.opdf-thumb {
  flex: 0 0 48px; width: 48px; height: 68px;
  overflow: hidden; display: flex; align-items: center; justify-content: center;
  background: transparent;
}
.opdf-thumb img {
  max-width: 100%; max-height: 100%; width: auto; height: auto;
  object-fit: contain;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .18);
}
/* Nur der Text-Fallback braucht einen Kasten - eine echte Seitenvorschau
   steht ohne Rahmen besser da. */
.opdf-thumb-pdf {
  font-size: .7rem; font-weight: 700; color: var(--op-danger);
  background: #fafafa; border: 1px solid var(--op-line);
}
.opdf-thumb-loading::after {
  content: ''; width: 16px; height: 16px; border-radius: 50%;
  border: 2px solid var(--op-line); border-top-color: var(--op-green);
  animation: opdf-spin .8s linear infinite;
}
@keyframes opdf-spin { to { transform: rotate(360deg); } }

.opdf-meta { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.opdf-meta strong { font-weight: 400; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.opdf-meta small { color: var(--op-muted); }

.opdf-item-actions { display: flex; gap: .25rem; }
.opdf-item-actions button {
  border: 1px solid var(--op-line); background: #fff;
  width: 2rem; height: 2rem; cursor: pointer; line-height: 1; color: var(--op-ink);
}
.opdf-item-actions button:hover { background: var(--op-green-soft); border-color: var(--op-green); }
.opdf-item-actions .opdf-del:hover {
  background: #fdecec; border-color: #e0a2a2; color: var(--op-danger);
}

/* ------------------------------------------------- Konfigurations-Panel */
.opdf-form { margin-top: 1.75rem; }
/* Muss VOR .opdf-row stehen und !important sein: display:flex wuerde das
   hidden-Attribut sonst ueberschreiben und die Custom-Zeile immer zeigen. */
#onlyprint_pdftool [hidden] { display: none !important; }

.opdf-panel { border: 1px solid var(--op-line); background: #fff; }
.opdf-panel-head {
  background: var(--op-panel-head);
  padding: .7rem .9rem;
  font-weight: 700; font-style: italic; text-transform: uppercase;
  font-size: 1.05rem; color: var(--op-ink);
  border-bottom: 1px solid var(--op-line);
}

#onlyprint_pdftool .opdf-row {
  display: flex; align-items: center; gap: .75rem;
  padding: .55rem .9rem;
  border-bottom: 1px solid #ececec;
  margin: 0;
}
/* Label wie im Shop: normal geschrieben und dunkel, keine gesperrten Versalien.
   text-align und width mit hoher Spezifitaet, weil Themes Formularlabels gern
   rechtsbuendig setzen - dann klafft links im Label-Feld eine grosse Luecke. */
#onlyprint_pdftool .opdf-row > label:first-child {
  flex: 0 0 10rem; width: 10rem; padding: 0; margin: 0;
  font-weight: 400; font-size: 1rem; color: var(--op-ink);
  text-transform: none; letter-spacing: normal;
  text-align: left;
}
#onlyprint_pdftool .opdf-radios {
  display: flex; flex-direction: column; align-items: flex-start;
  gap: .2rem; text-align: left;
}
#onlyprint_pdftool .opdf-radios label {
  display: flex; align-items: baseline; gap: .4rem;
  font-weight: 400; margin: 0;
}
#onlyprint_pdftool .opdf-advanced label { font-weight: 400; margin: 0; }
#onlyprint_pdftool .opdf-scale-hint {
  display: block; color: var(--op-muted); font-size: .85rem;
  margin-top: .2rem; max-width: 34rem;
}
#onlyprint_pdftool .opdf-checkline { gap: .1rem; }
.opdf-inline { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.opdf-inline input[type=number] { width: 5rem; }
.opdf-unit { color: var(--op-muted); }
.opdf-custom span { display: flex; gap: .5rem; }
.opdf-custom input { width: 6rem; }

#onlyprint_pdftool input[type=number],
#onlyprint_pdftool input[type=text],
#onlyprint_pdftool select {
  border: 1px solid var(--op-line); padding: .35rem .5rem;
  color: var(--op-ink); background: #fff; font: inherit;
  margin: 0;
}
/* Bedienelemente nehmen die Breite der Zeile ein, statt links zu kleben und
   rechts die halbe Panelbreite leer zu lassen. Nach oben gedeckelt: ein
   Auswahlfeld ueber die volle Breite wirkt unruhig. */
#onlyprint_pdftool .opdf-row > *:last-child:not(label:first-child) {
  flex: 1 1 auto; min-width: 0;
}
#onlyprint_pdftool select { min-width: 14rem; width: 100%; max-width: 24rem; }
#onlyprint_pdftool input:focus, #onlyprint_pdftool select:focus {
  outline: none; border-color: var(--op-green);
  box-shadow: 0 0 0 2px rgba(175, 203, 49, .3);
}
#onlyprint_pdftool input[type=radio], #onlyprint_pdftool input[type=checkbox] {
  accent-color: var(--op-green);
}

/* Erweiterte Optionen als letzte Panel-Zeile, aufklappbar */
.opdf-advanced { margin: 0; padding: 0; background: transparent; border: 0; }
.opdf-advanced summary {
  cursor: pointer; padding: .6rem .9rem; color: var(--op-ink);
  list-style: none; font-weight: 400;
}
.opdf-advanced summary::-webkit-details-marker { display: none; }
/* Das Leerzeichen muss als \00a0 stehen: ein normales Leerzeichen nach einer
   Hex-Escape-Sequenz beendet diese nur und verschwindet. */
.opdf-advanced summary::before { content: '+\00a0'; color: var(--op-green); font-weight: 700; }
.opdf-advanced[open] summary::before { content: '\2013\00a0'; }
.opdf-advanced summary:hover { color: var(--op-green-dark); }
#onlyprint_pdftool .opdf-advanced > label { display: block; padding: .2rem .9rem; text-align: left; }
#onlyprint_pdftool .opdf-advanced > label:last-child { padding-bottom: .8rem; }
.opdf-advanced small { display: block; color: var(--op-muted); font-size: .8rem; margin-top: .15rem; }

/* ----------------------------------------------------------------- Aktion */
.opdf-actions { display: flex; align-items: center; gap: 1rem; margin-top: 1.5rem; flex-wrap: wrap; }

/* Wie der Warenkorb-Button im Shop: gruen mit gerundeten Ecken, weisse
   fette Versalschrift, im Hover nach Grau. */
#onlyprint_pdftool #opdf-submit {
  background: var(--op-green); border: 0; border-radius: 6px; color: #fff;
  font-weight: 700; text-transform: uppercase; font-size: .95rem;
  padding: 1rem 2rem; cursor: pointer;
  transition: background .15s;
}
#onlyprint_pdftool #opdf-submit:hover:not(:disabled),
#onlyprint_pdftool #opdf-submit:focus-visible:not(:disabled) {
  background: var(--op-grey-hover);
}
#onlyprint_pdftool #opdf-submit:disabled { background: #d8d8d8; color: #fff; cursor: not-allowed; }

/* Zusammenfassung im Stil der Preisuebersicht auf den Produktseiten:
   Label links, Wert rechts, Zeilen untereinander, Summe abgesetzt. */
.opdf-summary {
  margin-top: 1.25rem; max-width: 24rem;
  border: 1px solid var(--op-line);
  font-size: .95rem;
}
.opdf-sum-row {
  display: flex; justify-content: space-between; gap: 1rem;
  padding: .45rem .9rem;
  border-bottom: 1px solid #ececec;
}
.opdf-sum-row:last-child { border-bottom: 0; }
.opdf-sum-row > span:first-child { color: var(--op-muted); }
.opdf-sum-total {
  background: #fafafa;
  font-weight: 700; font-size: 1.05rem;
}
.opdf-sum-total > span:first-child { color: var(--op-ink); }
.opdf-checkline { display: flex; flex-direction: column; gap: .15rem; }
.opdf-checkline small { color: var(--op-muted); font-size: .8rem; }

.opdf-status { font-size: .9rem; color: var(--op-muted); }
.opdf-status.opdf-error { color: var(--op-danger); }
.opdf-status.opdf-ok { color: #6d8a12; }
.opdf-status.opdf-busy { color: var(--op-green-dark); }

@media (max-width: 640px) {
  #onlyprint_pdftool .opdf-row { flex-direction: column; align-items: flex-start; gap: .3rem; }
  #onlyprint_pdftool .opdf-row > label:first-child { flex: none; width: auto; }
  #onlyprint_pdftool select { min-width: 0; width: 100%; }
}

/* ------------------------------------------------------- Hinweisseite
   Wird ohne das Werkzeug ausgeliefert (nicht angemeldet, Testbetrieb,
   abgeschaltet). Gleiche Formensprache wie der Rest, nur ruhiger. */
.opdf-gate { max-width: 44rem; }
#onlyprint_pdftool .opdf-gate-title {
  font-weight: 700; font-style: italic; text-transform: uppercase;
  font-size: 1.15rem; color: var(--op-ink); margin: 0 0 .75rem;
}
#onlyprint_pdftool .opdf-gate-text { color: var(--op-ink); margin: 0 0 1rem; }
#onlyprint_pdftool .opdf-gate-list {
  list-style: none; margin: 0 0 1.5rem; padding: 0;
  border: 1px solid var(--op-line); background: #fff;
}
/* flex statt Texteinzug: sonst rutscht auf schmalen Displays die zweite
   Zeile unter das Haekchen statt unter den Text. */
#onlyprint_pdftool .opdf-gate-list li {
  display: flex; gap: .5rem;
  padding: .55rem .9rem; border-bottom: 1px solid #ececec; color: var(--op-ink);
}
#onlyprint_pdftool .opdf-gate-list li:last-child { border-bottom: 0; }
#onlyprint_pdftool .opdf-gate-list li::before {
  content: '\2713'; color: var(--op-green); font-weight: 700; flex: 0 0 auto;
}

.opdf-gate-actions { display: flex; align-items: center; gap: 1.25rem; flex-wrap: wrap; }
/* Wie der Warenkorb-Button im Shop - siehe #opdf-submit */
#onlyprint_pdftool .opdf-gate-button {
  display: inline-block;
  background: var(--op-green); border: 0; border-radius: 6px; color: #fff;
  font-weight: 700; text-transform: uppercase; font-size: .95rem;
  padding: 1rem 2rem; cursor: pointer; text-decoration: none;
  transition: background .15s;
}
#onlyprint_pdftool .opdf-gate-button:hover,
#onlyprint_pdftool .opdf-gate-button:focus-visible {
  background: var(--op-grey-hover); color: #fff; text-decoration: none;
}
#onlyprint_pdftool .opdf-gate-secondary { color: var(--op-muted); text-decoration: underline; }
#onlyprint_pdftool .opdf-gate-secondary:hover { color: var(--op-green-dark); }

/* --------------------------------------------------------- Datenschutz
   Absichtlich zurueckhaltend: die Aussage soll auffindbar sein, ohne mit
   dem eigentlichen Werkzeug um Aufmerksamkeit zu konkurrieren. */
.opdf-privacy {
  margin-top: 2.5rem; padding-top: 1.25rem;
  border-top: 1px solid var(--op-line);
  color: var(--op-muted); font-size: .875rem;
}
#onlyprint_pdftool .opdf-privacy-title {
  font-weight: 700; font-style: italic; text-transform: uppercase;
  font-size: .9rem; color: var(--op-ink); margin: 0 0 .5rem;
}
#onlyprint_pdftool .opdf-privacy p { margin: 0 0 .5rem; }
#onlyprint_pdftool .opdf-privacy p:last-child { margin-bottom: 0; }