/* Weiterleitungs-Generator (301 bis 308) im seorado-Stil: ruhig, monochrom, Tinte als Akzent */

.redirect-generator{min-width:0;max-width:100%}
.redirect-generator .hidden{display:none}

/* Kopf */
.redirect-generator .rg-header{margin:0 0 18px}
.redirect-generator .rg-header h3{font-size:19px;font-weight:500;letter-spacing:-.015em;line-height:1.3;margin:0;text-wrap:balance}
.redirect-generator .rg-content{min-width:0}

/* Moduswahl als Segment-Steuerung */
.redirect-generator .mode-selector{display:flex;gap:4px;width:fit-content;max-width:100%;padding:4px;margin:0 0 22px;background:var(--muted);border-radius:11px}
.redirect-generator .mode-btn{display:flex;background:transparent;align-items:center;justify-content:center;text-align:center;padding:8px 16px;border:1px solid transparent;border-radius:8px;
  font-size:14px;font-weight:500;line-height:1.3;color:var(--gray);cursor:pointer;user-select:none;-webkit-user-select:none;transition:color .15s,background-color .15s,border-color .15s}
.redirect-generator .mode-btn:hover:not(.active){background:transparent;color:var(--ink)}
.redirect-generator .mode-btn.active{background:#fff;border-color:var(--line);color:var(--ink);box-shadow:0 1px 2px rgba(17,17,17,.06);cursor:default}

/* Raster: zwei Spalten, bei wenig Platz untereinander */
.redirect-generator .two-col{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:0 20px}
.redirect-generator .col{min-width:0}
.redirect-generator .form-group{margin:0 0 18px;min-width:0}
.redirect-generator label{position:relative;display:block;font-size:13.5px;font-weight:500;margin:0 0 7px}

/* Hilfetexte */
.redirect-generator .helper-text{display:block;margin-top:6px;font-size:12.5px;line-height:1.45;color:var(--gray)}

/* Protokoll und URL als zusammenhängendes Feld */
.redirect-generator .url-input-group{display:flex;flex-wrap:wrap;align-items:stretch;width:100%;min-width:0}
.redirect-generator .protocol-select{flex:0 0 auto;width:auto;min-width:0;margin-right:-1px;padding:10px 30px 10px 12px;font-size:14px;
  background-color:var(--muted);background-position:right 10px center;border-top-right-radius:0;border-bottom-right-radius:0}
.redirect-generator .url-input{flex:1 1 0;width:auto;min-width:0;border-top-left-radius:0;border-bottom-left-radius:0}
.redirect-generator .protocol-select:focus,.redirect-generator .url-input:focus{position:relative;z-index:1}

/* Auswahlfelder */
.redirect-generator select:disabled{background-color:var(--muted);color:var(--gray);cursor:not-allowed;opacity:1}

/* Fehlermeldungen des Skripts (Inline-Abstände an das neue Raster anpassen) */
.redirect-generator .error-message{flex:0 0 100%;margin:6px 0 0!important;font-size:12.5px!important;line-height:1.4;color:var(--bad)!important}

/* Meta-Refresh-Optionen */
.redirect-generator .option-group{margin:0 0 18px;padding:14px 16px;background:var(--muted);border:1px solid var(--line);border-radius:12px}
.redirect-generator .option-group input{max-width:140px;background:#fff}

/* Bulk-Tabelle */
.redirect-generator .bulk-table{margin:0 0 12px;border:1px solid var(--line);border-radius:12px;background:#fff;overflow:hidden}
.redirect-generator .bulk-table-header{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;padding:9px 104px 9px 12px;
  background:var(--muted);border-bottom:1px solid var(--line)}
.redirect-generator .bulk-table-header .bulk-table-cell{font-size:12.5px;font-weight:500;color:var(--gray)}
.redirect-generator .bulk-table-cell{min-width:0}
.redirect-generator .bulk-row{display:flex;align-items:flex-start;gap:12px;padding:12px;border-bottom:1px solid var(--line);animation:rg-row-in .2s ease-out}
.redirect-generator .bulk-row:last-child{border-bottom:0}
.redirect-generator .bulk-row-inputs{flex:1 1 auto;min-width:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
@keyframes rg-row-in{from{opacity:0}to{opacity:1}}

/* Sekundäre Buttons */
.redirect-generator .delete-row-btn,.redirect-generator .add-row-btn,.redirect-generator .copy-btn{background:var(--line);color:var(--ink)}
.redirect-generator .delete-row-btn:hover,.redirect-generator .add-row-btn:hover,.redirect-generator .copy-btn:hover{background:var(--line-strong)}
.redirect-generator .delete-row-btn{flex:0 0 80px;width:80px;min-height:43px;padding:10px 8px;font-size:13.5px}
.redirect-generator .add-row-btn{display:inline-flex;align-items:center;gap:8px;padding:9px 14px 9px 12px;font-size:13.5px}
.redirect-generator .add-row-btn::before{content:"+";flex:none;font-size:18px;font-weight:400;line-height:14px;margin-top:-2px}

/* Hauptaktion */
.redirect-generator #generateBtn{display:block;margin:4px 0 0;padding:12px 20px;font-size:14.5px}

/* Ergebnis */
.redirect-generator .output{display:none;position:relative;margin-top:22px;padding:16px 20px 20px;background:var(--muted);border:1px solid var(--line);border-radius:var(--radius);min-width:0}
.redirect-generator .output h4{display:flex;align-items:center;min-height:36px;margin:0 0 10px;font-size:15px;font-weight:500}
.redirect-generator .output-content{min-width:0}
.redirect-generator .output pre{margin:0;max-height:440px;white-space:pre-wrap;overflow-wrap:anywhere;word-break:normal}
.redirect-generator .output pre:empty{min-height:48px}
.redirect-generator .copy-btn{position:absolute;top:16px;right:20px;padding:9px 14px;font-size:13.5px}

/* Tooltips */
.redirect-generator .tooltip{display:inline-block;vertical-align:1px;margin-left:5px;cursor:help;line-height:1}
.redirect-generator .tooltip-icon{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;
  border:1px solid var(--line-strong);background:#fff;color:var(--gray);font-size:10.5px;font-weight:600;line-height:1;transition:background-color .15s,color .15s,border-color .15s}
.redirect-generator .tooltip:hover .tooltip-icon{background:var(--ink);border-color:var(--ink);color:#fff}
.redirect-generator .tooltip-text{position:absolute;left:0;bottom:calc(100% + 7px);z-index:10;width:max-content;max-width:min(280px,100%);
  padding:8px 10px;border-radius:7px;background:var(--ink);color:#fff;font-size:12.5px;font-weight:400;line-height:1.45;text-align:left;
  box-shadow:0 4px 12px rgba(17,17,17,.12);visibility:hidden;opacity:0;pointer-events:none;transition:opacity .15s,visibility .15s}
.redirect-generator .tooltip:hover .tooltip-text,.redirect-generator .tooltip:focus-within .tooltip-text{visibility:visible;opacity:1}

/* Handy */
@media (max-width:560px){
  .redirect-generator .bulk-table-header{display:none}
  .redirect-generator .bulk-row{flex-direction:column;align-items:stretch;gap:10px;padding:14px 12px}
  .redirect-generator .bulk-row-inputs{grid-template-columns:minmax(0,1fr);gap:10px}
  .redirect-generator .bulk-row .bulk-table-cell::before{display:block;margin:0 0 5px;font-size:12.5px;font-weight:500;color:var(--gray)}
  .redirect-generator .bulk-row .bulk-table-cell:first-child::before{content:"Quell-URL"}
  .redirect-generator .bulk-row .bulk-table-cell:last-child::before{content:"Ziel-URL"}
  .redirect-generator .delete-row-btn{flex:none;align-self:flex-end;width:auto;min-height:0;padding:8px 14px}
  .redirect-generator #generateBtn{width:100%}
  .redirect-generator .output{padding:14px 14px 16px}
  .redirect-generator .output pre{padding:12px 14px;font-size:12.5px}
  .redirect-generator .output h4{min-height:0}
  .redirect-generator .copy-btn{position:static;display:block;width:100%;margin-top:10px}
}
@media (max-width:480px){
  .redirect-generator .rg-header h3{font-size:17.5px}
  .redirect-generator .mode-selector{width:100%}
  .redirect-generator .mode-btn{flex:1 1 0;min-width:0;padding:8px 8px;font-size:13.5px}
}