.footer_footer {
    background-image: linear-gradient(190deg, #ffdde0c4 5%, #806c9a6e 70%), url(../../../images_dust/background_footer.jpg);
    font-family: "DMSerifDisplay-Regular", serif;
    color: #ffffff;
    letter-spacing: 4px;
    padding: 30px;
    background-attachment: fixed;
}

.footer_buttons { display: inline-block; }
.button_foot { margin: 10px; }
.button_foot i { font-size: 18px; color: #ffffff; }
.footer_themeselec { display: inline-block; padding: 10px; margin-left: 70px; background-color: #f0e8ff85; vertical-align: top; font-family: 'SF Buttacup Lettering', sans-serif; }
.footer_copyrigth { display: inline-block; float: right; font-size: 11px; background-color: #f0e8ff85; padding: 15px; color: #000000; font-weight: bold; font-family: 'SF Buttacup Lettering', sans-serif; }

/* ============================================================
   FOOTER CSS - fading-to-dust.de
   ============================================================ */

.footer-box { background: rgba(160, 135, 190, 0.30); box-sizing: border-box; position: relative; }

/* HAUPT-WRAPPER */
#footer-wrapper {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    width: 100%;
    box-sizing: border-box;
    padding: 20px;
    background-color: #ffffff7d;
    border-top: 5px solid #5a4179;
}

/* FRAKTIONSFARBEN - border-top */
#footer-wrapper.g8,  #footer-wrapper.g16 { border-top-color: #54426c; } /* Pulse */
#footer-wrapper.g10, #footer-wrapper.g18 { border-top-color: #3b8aaa; } /* Core */
#footer-wrapper.g11, #footer-wrapper.g19 { border-top-color: #7b68ee; } /* Echo */
#footer-wrapper.g12, #footer-wrapper.g20 { border-top-color: #0066a2; } /* Instance */
#footer-wrapper.g14, #footer-wrapper.g17 { border-top-color: #ba55d3; } /* Signal */
#footer-wrapper.g15, #footer-wrapper.g21 { border-top-color: #2f4f4f; } /* Anomaly */

/* LINKE SEITE (Stats + Online + WhoWasOnline) */
#footer-left-side {
    display: flex;
    flex-direction: column;
    flex: 2.2;
    min-width: 0;
}

/* STATS-BALKEN nur links */
#footer-stats-bar {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
    background: #806c9a29;
    padding: 12px 20px;
    box-sizing: border-box;
    gap: 10px;
    flex-wrap: nowrap;
}
.footer-stat-item {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    gap: 5px;
    border: 1px solid #1a1a1a;
    padding: 4px 8px;
    line-height: 1;
    background: none;
    white-space: nowrap;
}
.footer-stat-number {
    font-family: "DMSerifDisplay-Regular", serif;
    font-size: 0.82em;
    color: #1a1a1a;
    line-height: 1;
}
.footer-stat-label {
    font-family: "DMSerifDisplay-Regular", serif;
    font-size: 0.82em;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #1a1a1a;
}

/* ONLINE + WHO WAS ONLINE nebeneinander */
#footer-middle-row {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    flex: 1;
    background-color: #806c9a29;
}

.footer-mid-box { flex: 1; min-width: 0; }

#footer-online-box {
    padding: 0 16px 14px 16px;
    display: flex;
    flex-direction: column;
    margin: 40px 10px 20px 20px;
    min-height: 140px;
}
#footer-online-box .footer-box-title {
    font-family: "DMSerifDisplay-Regular", serif;
    font-size: 1.9em;
    color: #1a1a1a;
    line-height: 1;
    align-self: flex-start;
    position: relative;
    top: -0.7em;
    letter-spacing: 0.06em;
}
#footer-online-box .footer-box-content {
    flex: 1;
    height: 120px;
    overflow: auto;
    text-align: justify;
    padding: 5px;
}

.footer-online-link {
    font-family: "DMSerifDisplay-Regular", serif;
    font-size: 0.38em;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: rgba(58,48,64,0.55);
    text-decoration: none;
    vertical-align: middle;
    margin-left: 6px;
}
.footer-online-link:hover { color: #3a3040; }

#footer-whowasonline-box {
    padding: 0 16px 14px 16px;
    background: rgba(160, 135, 190, 0.22);
    display: flex;
    flex-direction: column;
    min-height: 140px;
    margin: 40px 20px 20px 10px;
}
#footer-whowasonline-box .footer-box-title {
    font-family: "DMSerifDisplay-Regular", serif;
    font-size: 1.9em;
    color: #1a1a1a;
    line-height: 1;
    align-self: flex-start;
    position: relative;
    top: -0.6em;
}
#footer-whowasonline-box .footer-box-content {
    font-family: "DMSerifDisplay-Regular", serif;
    font-size: 0.7em;
    letter-spacing: 0.07em;
    color: #3a3040;
    line-height: 1.75;
    height: 120px;
    overflow: auto;
    text-align: justify;
    padding: 5px;
}

/* RECHTE SEITE */
#footer-right-side {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 260px;
    background: rgba(160, 135, 190, 0.18);
    padding: 35px 25px;
    box-sizing: border-box;
    gap: 20px;
    background-image: linear-gradient(190deg, #ffdde0c4 5%, #806c9a6e 70%), url(../../../images_dust/background_footer.jpg);
    background-attachment: fixed;
}

/* WILLKOMMEN */
#footer-welcome-box {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    background: transparent;
    padding: 20px;
    align-items: center;
    background-color: #f0e8ff85;
}
.footer-welcome-script {
    font-family: "DMSerifDisplay-Regular", serif;
    font-size: 1.1em;
    color: #1a1a1a;
    line-height: 1.1;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}
.footer-welcome-name {
    font-family: "DMSerifDisplay-Regular", serif;
    font-size: 1.4em;
    color: #1a1a1a;
    line-height: 1.1;
}
.footer-welcome-name a { color: inherit; text-decoration: none; }

/* NEW CHARACTERS */
#footer-newchars-box {
    padding: 0;
    background: transparent;
    display: flex;
    flex-direction: column;
    padding: 20px;
    align-items: center;
    background-color: #f0e8ff85;
}
#footer-newchars-box .footer-box-title {
    font-family: "DMSerifDisplay-Regular", serif;
    font-size: 1.1em;
    color: #1a1a1a;
    line-height: 1;
    margin-bottom: 10px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}
.footer-newchar-entry { display: flex; flex-direction: row; align-items: baseline; gap: 10px; margin-bottom: 6px; }
.footer-newchar-date { font-family: "DMSerifDisplay-Regular", serif; font-size: 0.65em; text-transform: uppercase; letter-spacing: 0.08em; color: #5a4a6a; white-space: nowrap; }
.footer-newchar-name { font-family: "DMSerifDisplay-Regular", serif; font-size: 1em; font-weight: bold; text-decoration: none; color: #1a1a1a; }

/* USER-LISTEN */
.footer-userlist { font-family: "DMSerifDisplay-Regular", serif; font-size: 1.2em; line-height: 1.8; color: #3a3040; font-weight: lighter; }
.footer-userlist--empty { font-style: italic; opacity: 0.55; }

/* AWAY-BALKEN volle Breite */
#footer-away-bar {
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%;
    box-sizing: border-box;
    background: rgba(140, 110, 175, 0.30);
    padding: 10px 24px;
    gap: 16px;
    flex-wrap: wrap;
}

/* FRAKTIONSFARBEN - background away-bar */
#footer-away-bar.g8,  #footer-away-bar.g16 { background: rgba(84, 66, 108, 0.30); }   /* Pulse */
#footer-away-bar.g10, #footer-away-bar.g18 { background: rgba(59, 138, 170, 0.30); }  /* Core */
#footer-away-bar.g11, #footer-away-bar.g19 { background: rgba(123, 104, 238, 0.30); } /* Echo */
#footer-away-bar.g12, #footer-away-bar.g20 { background: rgba(0, 102, 162, 0.30); }   /* Instance */
#footer-away-bar.g14, #footer-away-bar.g17 { background: rgba(186, 85, 211, 0.30); }  /* Signal */
#footer-away-bar.g15, #footer-away-bar.g21 { background: rgba(47, 79, 79, 0.30); }    /* Anomaly */

.footer-away-label {
    font-family: "DMSerifDisplay-Regular", serif;
    font-size: 0.82em;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: #3a3040;
    white-space: nowrap;
}
.footer-away-content {
    font-family: "DMSerifDisplay-Regular", serif;
    font-size: 0.82em;
    color: #3a3040;
}
.footer-away-detail {
    font-family: "DMSerifDisplay-Regular", serif;
    font-size: 0.9em;
    color: #5a4a6a;
    font-style: italic;
    letter-spacing: 0.04em;
    padding-right: 5px;
}

/* FRAKTIONEN */
#footer-factions-bar {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
    background: #806c9a29;
    padding: 12px 20px;
    box-sizing: border-box;
    gap: 10px;
    flex-wrap: nowrap;
}
.footer-faction-item {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    gap: 5px;
    border: 1px solid #1a1a1a;
    padding: 4px 8px;
    line-height: 1;
    background: none;
    white-space: nowrap;
}
.footer-faction-number {
    font-family: "DMSerifDisplay-Regular", serif;
    font-size: 0.82em;
    color: #1a1a1a;
    line-height: 1;
}
.footer-faction-label {
    font-family: "DMSerifDisplay-Regular", serif;
    font-size: 0.82em;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

@media (max-width: 960px) {
    #footer-wrapper { flex-direction: column; }
    #footer-middle-row { flex-direction: column; }
    #footer-stats-bar, #footer-factions-bar { justify-content: flex-start; }
}