/* =========================
   FANTASY DARK WIKI THEME
   ========================= */

body {
    font-family: "Georgia", serif;
    margin: 0;
    padding: 0;

    /* Hintergrundbild */
    background-image: url("../bilder/hintergrund.png");
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    background-repeat: no-repeat;

    color: #e6d3b3; /* warmes Pergament-Gold */
}

/* 🌫 dunkle Overlay-Schicht für bessere Lesbarkeit */
body::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

    background: rgba(0, 0, 0, 0.55);
    z-index: -1;
}

/* =========================
   HEADER
   ========================= */

header {
    text-align: center;
    padding: 25px 10px;
}

header h1 {
    margin: 0;
    font-size: 42px;
    letter-spacing: 2px;
    color: #d4af37; /* Gold */
    text-shadow: 0 0 10px rgba(0,0,0,0.8);
}

header p {
    margin-top: 5px;
    color: #c7b08a;
    font-style: italic;
}

/* Link im Titel */
.site-title {
    text-decoration: none;
    color: inherit;
}

/* =========================
   SUCHE
   ========================= */

.search-box {
    position: relative;
    width: 420px;
    margin: 20px auto;
}

#searchInput {
    width: 100%;
    padding: 12px;
    border-radius: 6px;

    background: rgba(20, 15, 10, 0.85);
    border: 1px solid #5a4630;

    color: #f0e0c2;
    font-size: 14px;
}

#searchInput::placeholder {
    color: #b8a07a;
}

/* Ergebnisse */
#results {
    position: absolute;
    width: 100%;
    background: rgba(20, 15, 10, 0.95);
    border: 1px solid #5a4630;
    border-top: none;

    max-height: 220px;
    overflow-y: auto;
}

.result-item {
    padding: 10px;
    border-bottom: 1px solid rgba(90, 70, 48, 0.4);
}

.result-item a {
    color: #e6d3b3;
    text-decoration: none;
    display: block;
}

.result-item:hover {
    background: rgba(212, 175, 55, 0.15);
}

/* =========================
   CONTENT BOX
   ========================= */

main {
    max-width: 900px;
    margin: 30px auto;
    padding: 25px;

    background: rgba(15, 10, 5, 0.78);
    border: 1px solid #5a4630;
    border-radius: 10px;

    box-shadow: 0 0 25px rgba(0,0,0,0.7);
}

/* =========================
   LINKS & TEXT
   ========================= */

a {
    color: #d4af37;
}

a:hover {
    color: #ffe08a;
    text-shadow: 0 0 5px rgba(255, 224, 138, 0.5);
}

/* =========================
   LISTEN
   ========================= */

ul {
    padding-left: 20px;
}

li {
    margin: 5px 0;
}

/* =========================
   FOOTER
   ========================= */

footer {
    text-align: center;
    padding: 20px;
    font-size: 12px;
    color: #a8926f;
    opacity: 0.8;
}