/* =========================================
   CYBERPUNK / ARCADE OVERRIDE FOR BLUDIT
   ========================================= */

/* 1. FONTS IMPORTIEREN */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600&family=Luckiest+Guy&family=JetBrains+Mono:wght@400;700&display=swap');

/* 2. GLOBALER HINTERGRUND (Wie auf der Hauptseite) */
body {
    background-color: #020617 !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='49' viewBox='0 0 28 49'%3E%3Cg fill-rule='evenodd'%3E%3Cg id='hexagons' fill='%2300e5ff' fill-opacity='0.03' fill-rule='nonzero'%3E%3Cpath d='M13.99 9.25l13 7.5v15l-13 7.5L1 31.75v-15l12.99-7.5zM3 17.9v12.7l10.99 6.34 11-6.35V17.9l-11-6.34L3 17.9zM0 15l12.98-7.5V0h-2v6.35L0 12.69v2.3zm0 18.5L12.98 41v8h-2v-6.85L0 35.81v-2.3zM15 0v7.5L27.99 15H28v-2.3L17 6.35V0h-2zm0 49v-7.5L27.99 34H28v2.3L17 42.65V49h-2z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !important;
    color: #cbd5e1 !important;
    font-family: 'Inter', sans-serif !important;
}

/* 3. HEADINGS & LINKS */
h1, h2, h3, h4, h5, h6 {
    font-family: 'Luckiest Guy', cursive !important;
    color: #fff !important;
    text-shadow: 2px 2px 0px #000;
    letter-spacing: 1px;
}

a {
    color: #00E5FF !important;
    text-decoration: none;
    transition: all 0.3s;
}
a:hover {
    color: #fff !important;
    text-shadow: 0 0 10px #00E5FF;
}

/* 4. DER CONTENT CONTAINER (Glas-Panel) */
article, .card, .post {
    background: rgba(15, 23, 42, 0.85) !important;
    border: 1px solid rgba(0, 229, 255, 0.2) !important;
    border-radius: 12px !important;
    padding: 30px !important;
    margin-bottom: 30px !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5) !important;
    backdrop-filter: blur(5px);
    position: relative;
    overflow: hidden;
}

/* Terminal Header Streifen oben am Post */
article::before, .card::before {
    content: '';
    position: absolute; top: 0; left: 0; right: 0; height: 3px;
    background: linear-gradient(90deg, #00E5FF, #ec4899);
}

/* 5. SIDEBAR (Rechts) */
.sidebar, aside {
    background: rgba(2, 6, 23, 0.6) !important;
    border-left: 1px solid rgba(255,255,255,0.1) !important;
    padding: 20px !important;
}

/* Widgets in der Sidebar */
.plugin, .widget {
    margin-bottom: 30px;
    border: 1px solid #1e293b;
    background: #0f172a;
    padding: 15px;
    border-radius: 8px;
}
.plugin-title, .widget-title {
    font-family: 'JetBrains Mono', monospace !important;
    color: #ec4899 !important;
    border-bottom: 1px dashed #334155;
    padding-bottom: 10px;
    margin-bottom: 15px;
    font-size: 0.9rem;
}

/* 6. INPUTS & SUCHE */
input, textarea, select {
    background: #020617 !important;
    border: 1px solid #334155 !important;
    color: #00E5FF !important;
    padding: 10px !important;
    font-family: 'JetBrains Mono', monospace !important;
    border-radius: 4px !important;
}
input:focus {
    border-color: #00E5FF !important;
    box-shadow: 0 0 10px rgba(0,229,255,0.2) !important;
    outline: none;
}

/* 7. BUTTONS (Read More etc.) */
.btn, button, input[type="submit"] {
    background: transparent !important;
    border: 1px solid #00E5FF !important;
    color: #00E5FF !important;
    font-family: 'JetBrains Mono', monospace !important;
    text-transform: uppercase;
    font-weight: bold;
    padding: 10px 20px !important;
    cursor: pointer;
    transition: all 0.2s;
}
.btn:hover, button:hover {
    background: #00E5FF !important;
    color: #000 !important;
    box-shadow: 0 0 15px #00E5FF;
}

/* 8. NAVBAR (Falls Bludit eine eigene hat) */
nav, .navbar {
    background: #020617 !important;
    border-bottom: 1px solid #1e293b !important;
}
.navbar-brand {
    font-family: 'Luckiest Guy', cursive !important;
    font-size: 1.5rem !important;
    color: #fff !important;
}

/* 9. FOOTER */
footer {
    background: #020617 !important;
    border-top: 1px solid #1e293b !important;
    color: #64748b !important;
    font-family: monospace !important;
    text-align: center;
    padding: 20px !important;
}