/* =========================
   RES – Tabs & Inhalte (Listenstyle)
   ========================= */

/* Tab-Leiste */
.res_tab{
  overflow:hidden;
  border:1px solid var(--hairline);
  background:var(--tbl-main-tr2);
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  padding:8px;
}
.res_bit form{ display:inline; }

/* Tab-Buttons wie .listen-link */
.res_tab button{
  background:var(--tbl-main-tr2);
  color:var(--akzent-hell);
  border:1px solid var(--hairline);
  border-radius:0;
  padding:6px 12px;
  font-size:var(--txtsmall);
  text-transform:uppercase;
  letter-spacing:.12em;
  cursor:pointer;
  transition:all .2s ease;
}
.res_tab button:hover,
.res_tab button.active{
  background:var(--tbl-main-tr);
  color:var(--design);
  border-color:var(--hairline);
}
.res_tab button.active{
  box-shadow:inset 0 -2px 0 var(--design);
}

/* Tab-Content Pane */
.res_tabcontent{
  background:var(--tbl-main-tr);
  border:1px solid var(--hairline);
  border-top:none;
  padding:10px 12px;
  animation:fadeEffect .18s ease;
}
@keyframes fadeEffect{ from{opacity:0} to{opacity:1} }

/* Ausgabe-Grid */
.res_ausgabe{
  display:flex; flex-wrap:wrap; gap:10px;
}
.res_ausgabe h1{
  flex-basis:100%;
  text-align:left;
  font-family:var(--akzenttext);
  font-size:var(--txtxsmall);
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--akzent-hell);
  margin:0 0 6px;
  border-bottom:1px solid var(--hairline);
  padding-bottom:6px;
}
.res_ausgabe .res_bit{
  flex:1 1 260px;
  background:var(--tbl-main-tr2);
  border:1px solid var(--hairline);
  padding:10px;
}

/* Add-Formular */
.res_add{
  display:flex; flex-wrap:wrap; justify-content:center; gap:10px;
  margin-top:10px;
}
.res_add h2{
  flex-basis:100%;
  text-align:left;
  font-family:var(--akzenttext);
  font-size:var(--txtxsmall);
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--akzent-hell);
  margin:0 0 6px;
  border-bottom:1px solid var(--hairline);
  padding-bottom:6px;
}
.res_add_save{
  flex-basis:100%;
  text-align:center;
  margin-top:6px;
}

/* Mod-Box (Hinweise/Editorbereich) */
.res_mod{
  background:var(--tbl-main-tr2);
  border:1px solid var(--hairline);
  padding:10px 12px;
  margin-top:8px;
}

/* Eingabezeilen */
.res_add_inputs,
.res_add_select{
  margin:6px 14px;
  display:flex; align-items:center; gap:8px;
}
.res_add_inputs{ justify-content:flex-end; }

/* Responsive */
@media (max-width: 700px){
  .res_tab{ gap:6px; padding:6px; }
  .res_tab button{ padding:6px 10px; letter-spacing:.1em; }
  .res_ausgabe .res_bit{ flex:1 1 100%; }
  .res_add_inputs, .res_add_select{ margin:6px 0; justify-content:space-between; }
}