/*
 * llms.txt-Generator auf litzki-systems.com (gebaut in diesem Repo, 29.10.2026).
 * Nur Tokens aus site.css, nichts unter 14 px, kein !important. Gleiche Bausteine wie der robots.txt-Generator.
 */

.lt-tool { --dc-pad: clamp(1.25rem, 3vw, 2rem); color: var(--color-gray-300); padding: 0 var(--dc-pad) var(--dc-pad); margin: 2rem 0 3rem; }
.lt-tool.dc { overflow: clip; container-type: inline-size; }
.lt-tool p { margin: 0 0 .5rem; }
.lt-tool a { color: var(--color-accent-light); }
.lt-tool code { font-family: var(--font-mono); font-size: var(--text-sm); color: var(--color-off-white); background: none; padding: 0; }
.lt-tool__note { font-size: var(--text-xs); color: var(--color-gray-400); }
.lt-tool p.lt-tool__note[data-lt="save"] { margin-top: 1rem; overflow-wrap: anywhere; }
.lt-tool:not(.is-ready) .lt-live { display: none; }

/* ---------- Abschnitte und Felder ---------- */
.lt-grid { display: grid; gap: 0 2rem; }
.lt-left, .lt-right { min-width: 0; }
.lt-left { container-type: inline-size; }
.lt-sec { margin: 1.75rem 0 0; padding-top: 1.25rem; border-top: 1px solid var(--color-navy-light); }
.lt-tool .lt-sec__head, .lt-import summary { font-family: var(--font-mono); font-size: var(--text-sm); letter-spacing: .06em; color: var(--color-off-white); margin: 0 0 .75rem; }
.lt-import summary { cursor: pointer; }
.lt-import[open] summary { margin-bottom: 1rem; }
.lt-tool .lt-sec__text { font-size: var(--text-sm); }
.lt-field { margin: 1rem 0 0; }
.lt-field:first-of-type { margin-top: 0; }
.lt-field__label { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .25rem 1rem; font-family: var(--font-sans); font-size: var(--text-sm); font-weight: 600; color: var(--color-off-white); margin-bottom: .35rem; }
.lt-field__hint { font-family: var(--font-sans); font-weight: 400; font-size: var(--text-xs); letter-spacing: 0; color: var(--color-gray-400); }
.lt-input { width: 100%; min-width: 0; font-family: var(--font-sans); font-size: var(--text-base); color: var(--color-off-white); background: var(--color-navy-dark); border: 1px solid var(--color-navy-light); border-radius: var(--radius-md); padding: .6rem .75rem; }
textarea.lt-input { font-family: var(--font-sans); font-size: var(--text-sm); line-height: 1.5; resize: vertical; }
#lt-paste { font-family: var(--font-mono); }
.lt-input--area { min-height: 7rem; }
.lt-input--short { min-height: 3.5rem; }
.lt-input:focus { border-color: var(--color-accent); }
.lt-input::placeholder { color: var(--color-gray-500); opacity: 1; }
.lt-input:focus-visible, .lt-chip:focus-visible, .lt-icon:focus-visible, .lt-tool .btn:focus-visible, .lt-import summary:focus-visible, .lt-disc summary:focus-visible, .lt-method summary:focus-visible { outline: 3px solid var(--color-accent); outline-offset: 2px; }
.lt-pair { display: grid; gap: 0 1rem; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); margin-top: 1rem; }
.lt-pair .lt-field { margin-top: 0; }

/* ---------- Knöpfe ---------- */
.lt-tool .lt-switch__label { font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: .08em; text-transform: uppercase; color: var(--color-accent); margin: 1.25rem 0 .4rem; }
.lt-switch__row { display: flex; flex-wrap: wrap; gap: .5rem; }
.lt-addrow { margin-top: 1rem; }
.lt-chip { font-family: var(--font-sans); font-size: var(--text-sm); font-weight: 500; color: var(--color-gray-300); background: var(--color-navy-dark); border: 1px solid var(--color-navy-light); border-radius: var(--radius-pill); padding: .45rem .95rem; cursor: pointer; transition: border-color .15s, color .15s; }
.lt-chip:hover { border-color: var(--color-accent); color: var(--color-off-white); }
.lt-icon { flex: none; display: inline-grid; place-items: center; width: 2.5rem; height: 2.5rem; font-family: var(--font-mono); font-size: var(--text-base); color: var(--color-gray-300); background: var(--color-navy-dark); border: 1px solid var(--color-navy-light); border-radius: var(--radius-md); cursor: pointer; transition: border-color .15s, color .15s; }
.lt-icon:hover:not(:disabled) { border-color: var(--color-accent); color: var(--color-off-white); }
.lt-icon:disabled { opacity: .35; cursor: default; }

/* ---------- Abschnitts-Editor ---------- */
.lt-secbox { margin-top: 1rem; padding: .85rem; border: 1px solid var(--color-navy-light); border-radius: .5rem; background: var(--color-navy-dark); }
.lt-secbox.is-opt { border-style: dashed; border-color: var(--color-gray-500); }
.lt-sechead__row { display: flex; gap: .5rem; align-items: center; }
.lt-secbtns { display: flex; gap: .35rem; }
.lt-secbox .lt-input { background: var(--color-navy); }
.lt-tool.dc ol.lt-links { list-style: none; margin: .75rem 0 0; padding: 0; display: grid; gap: .6rem; counter-reset: lt; }
.lt-tool.dc .lt-links li { margin: 0; }
.lt-link { display: grid; gap: .4rem; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "t x" "u u" "n n"; padding-left: .75rem; border-left: 2px solid var(--color-navy-light); }
.lt-link:focus-within { border-left-color: var(--color-accent); }
.lt-input--t { grid-area: t; font-weight: 600; }
.lt-input--u { grid-area: u; font-family: var(--font-mono); font-size: var(--text-sm); }
.lt-input--n { grid-area: n; font-size: var(--text-sm); }
.lt-icon--row { grid-area: x; }
.lt-chip--add { margin-top: .75rem; }

/* ---------- Ergebnis ---------- */
.lt-right { margin-top: 2rem; }
.lt-frame { background: var(--color-navy-dark); border: 1px solid var(--color-navy-light); border-radius: var(--radius-md); padding: .75rem; }
.lt-tool .lt-frame__bar { display: flex; align-items: center; gap: .5rem; font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: .06em; color: var(--color-gray-300); margin: 0 .25rem .6rem; }
.lt-frame__led { width: 8px; height: 8px; border-radius: 50%; background: var(--color-accent); flex: 0 0 auto; }
.lt-tool pre.lt-out { margin: 0; max-height: 32rem; overflow: auto; padding: .9rem 1rem; font-family: var(--font-mono); font-size: var(--text-sm); line-height: 1.55; color: var(--color-off-white); background: var(--color-navy); border: 1px solid var(--color-navy-light); border-radius: .4rem; white-space: pre-wrap; overflow-wrap: anywhere; scrollbar-width: thin; }
.lt-tool pre.lt-out.is-empty { color: var(--color-gray-400); }
.lt-tool pre.lt-out--small { max-height: none; margin-top: .75rem; }
.lt-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; margin-top: 1rem; }
.lt-actions--top { margin: 1.25rem 0 0; gap: .5rem; }
.lt-tool .btn--secondary { background: var(--color-navy-mid); color: var(--color-off-white); border: 1px solid var(--color-navy-light); }
.lt-tool .btn--secondary:hover { border-color: var(--color-accent); color: var(--color-accent-light); }
.lt-status { font-size: var(--text-xs); color: var(--color-accent-light); font-weight: 600; min-height: 1.25rem; }
.lt-tool.dc ul.lt-hints { list-style: none; margin: 0; padding: 0; display: grid; gap: .4rem; }
.lt-tool.dc .lt-hints li { margin: 0; padding: .45rem .65rem; font-size: var(--text-xs); color: var(--color-gray-300); border-left: 3px solid var(--color-gray-500); background: var(--color-navy-dark); border-radius: 0 .35rem .35rem 0; }
.lt-tool.dc .lt-hints li.is-warn { color: var(--color-off-white); border-left-color: var(--color-accent); }
.lt-tool.dc .lt-hints a { white-space: nowrap; }
.lt-disc { margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid var(--color-navy-light); font-size: var(--text-sm); }
.lt-disc summary { cursor: pointer; color: var(--color-off-white); font-weight: 600; }
.lt-disc[open] summary { margin-bottom: .6rem; }

@container (min-width: 1000px) {
  .lt-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 30rem); align-items: start; }
  .lt-right { position: sticky; top: calc(var(--nav-h) + 1rem); margin-top: 1.75rem; }
}
@container (min-width: 620px) {
  .lt-link { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr) auto; grid-template-areas: "t u x" "n n n"; }
}

.lt-method { margin-top: 1.5rem; padding-top: 1rem; border-top: 1px solid var(--color-navy-light); font-size: var(--text-xs); color: var(--color-gray-300); }
.lt-method summary { cursor: pointer; color: var(--color-off-white); font-weight: 600; }
.lt-tool.dc .lt-method ul { margin: .5rem 0 0; padding-left: 1.2rem; }
.lt-method li { margin: .25rem 0; }
.lt-tool .lt-more { margin: 1.25rem 0 0; font-size: var(--text-sm); color: var(--color-gray-300); }
