/* ==========================================================================
 DESIGN SYSTEM / VARIABLEN
 ========================================================================== */
:root {
 --primary: #3d80b0; /* Klassisches Blau für Links */
 --primary-hover: #2a5a7e;
 --accent: #c66d00; /* Warmes Orange für Titel & Menüs */
 --accent-hover: #945100;
 --text-dark: #2d2f3d; /* Dunkelgrau für bessere Lesbarkeit als reines Schwarz */
 --text-muted: #636363; /* Für Details und sekundäre Infos */
 --bg-light: #fafafa;
 --border-color: #e5e7ea;
 --font-main: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

/* ==========================================================================
 ALLGEMEINE STYLES
 ========================================================================== */
body {
 font-family: var(--font-main);
 font-size: 14px;
 line-height: 1.6;
 color: var(--text-dark);
 background-color: #ffffff;
}

/* Tabellen-Fallback (besser sind moderne Flexbox/Grid-Layouts) */
td {
 font-family: var(--font-main);
 font-size: 14px;
}

hr {
 border: 0;
 height: 1px;
 background-color: var(--border-color);
 margin: 20px 0;
}

label {
 cursor: pointer;
 font-weight: 500;
}

.copy {
 font-size: 11px;
 color: var(--text-muted);
}

/* ==========================================================================
 LINKS & INTERAKTIONEN
 ========================================================================== */
a {
 color: var(--primary);
 text-decoration: none;
 transition: color 0.2s ease, text-decoration 0.2s ease;
}

a:hover {
 color: var(--primary-hover);
 text-decoration: underline;
}

/* Subtile Links (z. B. für Fließtext/Namen) */
a.noun {
 color: var(--text-dark);
}

a.noun:hover {
 color: var(--primary);
 text-decoration: none;
}

/* ==========================================================================
 FORMULARE
 ========================================================================== */
form {
 padding: 0;
 margin: 0;
}

input, textarea, select {
 font-family: var(--font-main);
 font-size: 14px;
 padding: 8px 12px;
 border: 1px solid var(--border-color);
 border-radius: 4px;
 background-color: #ffffff;
 color: var(--text-dark);
 vertical-align: middle;
 transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

input:focus, textarea:focus, select:focus {
 outline: none;
 border-color: var(--primary);
 box-shadow: 0 0 0 3px rgba(61, 128, 176, 0.15);
}

/* ==========================================================================
 MENÜS & NAVIGATION
 ========================================================================== */
/* Horizontales Menü */
.uMenuH {
 display: flex;
 list-style: none;
 padding: 0;
 margin: 0;
 gap: 15px;
}

/* Vertikales Menü */
.uMenuV {
 list-style: none;
 padding: 0;
 margin: 0;
}

.uMenuV li {
 position: relative;
 margin-bottom: 8px;
 padding-left: 15px;
}

/* Eleganter CSS-Pfeil statt alter .gif-Grafik */
.uMenuV li::before {
 content: "•";
 color: var(--accent);
 position: absolute;
 left: 0;
 top: 0;
}

.uMenuV li a {
 color: var(--text-dark);
 font-weight: 500;
}

.uMenuV li a:hover,
.uMenuV a.uMenuItemA {
 color: var(--accent);
 text-decoration: none;
}

/* Spezielles Menü 1 */
a.menu1 {
 color: var(--accent);
 font-weight: 600;
}

a.menu1:hover {
 color: var(--accent-hover);
}

/* ==========================================================================
 KATEGORIEN (Module Part Menu)
 ========================================================================== */
.catsTd {
 padding: 8px 0 8px 15px;
}

.catName, .catNameActive {
 font-size: 13px;
 font-weight: 600;
}

a.catName { color: var(--text-dark); }
a.catName:hover { color: var(--primary); text-decoration: none; }

a.catNameActive { color: var(--primary); }

.catNumData {
 font-size: 11px;
 color: var(--text-muted);
 margin-left: 5px;
}

.catDescr {
 font-size: 12px;
 color: var(--text-muted);
 padding-left: 15px;
 margin-top: 2px;
}

/* ==========================================================================
 BEITRÄGE & ARTIKEL (Entries Style)
 ========================================================================== */
.eBlock {
 background: #ffffff;
 border: 1px solid var(--border-color);
 border-radius: 6px;
 padding: 20px;
 margin-bottom: 24px;
 box-shadow: 0 2px 4px rgba(0,0,0,0.02);
}

.blocktitle {
 font-size: 14px;
 font-weight: bold;
 color: #c24747;
 text-transform: uppercase;
 letter-spacing: 0.5px;
 margin-bottom: 15px;
}

.eTitle {
 font-size: 18px;
 font-weight: 700;
 color: var(--accent);
 margin-bottom: 12px;
}

.eTitle a { color: var(--accent); text-decoration: none; }
.eTitle a:hover { color: var(--accent-hover); }

.eMessage, .eText {
 text-align: justify;
 line-height: 1.7;
 margin-bottom: 15px;
}

.eText {
 padding-top: 15px;
 border-top: 1px solid var(--border-color);
}

/* Meta-Details unter/über Beiträgen */
.eDetails, .eDetails1, .eDetails2 {
 font-size: 12px;
 color: var(--text-muted);
 padding: 8px 0;
 border-top: 1px dashed var(--border-color);
 border-bottom: 1px dashed var(--border-color);
 display: flex;
 gap: 15px;
 flex-wrap: wrap;
}

.eDetails2 {
 border-top: none;
}

.eRating {
 font-size: 12px;
 font-weight: 600;
}

/* Downloads / Anhänge */
.eAttach {
 margin-top: 15px;
 padding: 10px 12px;
 background-color: var(--bg-light);
 border-radius: 4px;
 display: inline-flex;
 align-items: center;
 gap: 8px;
 font-size: 13px;
}

/* ==========================================================================
 FRAME / LAYOUT-HILFEN
 ========================================================================== */
.mframe { border-left: 1px solid var(--border-color); border-right: 1px solid var(--border-color); }
.colgray { border-right: 1px solid var(--border-color); background-color: var(--bg-light); }
.colwhite { border-right: 1px solid #ffffff; }
.msep { border-top: 1px solid var(--border-color); }
.product-card .product-tail { background-color: #ffffff; }

/* ==========================================================================
 PROFI-BUTTONS (Ehemals manTable-Klassen)
 ========================================================================== */
.manFlSbm { /* Submit Button */
 background-color: var(--primary);
 color: #ffffff;
 font-weight: 600;
 border: none;
 cursor: pointer;
 transition: background-color 0.2s;
}
.manFlSbm:hover { background-color: var(--primary-hover); }

.manFlRst { /* Reset Button */
 background-color: transparent;
 color: var(--text-muted);
 border: 1px solid var(--border-color);
 cursor: pointer;
}
.manFlRst:hover { background-color: var(--bg-light); color: var(--text-dark); }

.manTdError {
 color: #d93838;
 font-weight: 600;
 font-size: 13px;
}

.cAnswer {
 padding: 10px 15px;
 margin-left: 20px;
 background-color: var(--bg-light);
 border-left: 3px solid var(--primary);
 font-style: italic;
 border-radius: 0 4px 4px 0;
}