/* World of Solamin - Top Left Panel Style */
* { box-sizing: border-box; margin: 0; padding: 0; }

body {
    background-color: #050505; 
    background-image: url('https://solamin.eu/WorldOfSolamin_BG.png');
    /* Auf 'top center' geändert, damit der obere Rand nicht weggeschnitten wird */
    background-position: top center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    color: #e0e0e0;
    font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    min-height: 100vh;
    margin: 0;
    position: relative;
}

/* Navigations-Button oben rechts bleibt */
.top-nav {
    position: absolute;
    top: 20px;
    right: 30px;
    z-index: 10;
}

.btn-nav {
    background: transparent;
    color: #ffd700; 
    border: 1px solid #ffd700;
    padding: 8px 15px;
    border-radius: 6px;
    text-decoration: none;
    font-size: 0.8rem;
    font-weight: bold;
    text-transform: uppercase;
    transition: 0.3s;
}
.btn-nav:hover { background: #ffd700; color: #000; }

/* DER CONTAINER: Oben links, 1cm Abstand, transparent */
/* Grundstil für beide Karten */
.auth-card { 
    position: absolute; /* Wieder fest positioniert */
    background: rgba(10, 10, 10, 0.50); 
    border: 1px solid #333; 
    border-radius: 12px; 
    padding: 25px; 
    width: 320px; 
    box-shadow: 0 10px 40px rgba(0,0,0,0.8);
    text-align: center;
}

/* Dashboard: Oben Links fixieren */
#dashboard-card {
    top: 1cm;
    left: 1cm;
}

/* Recharge: Unten Links fixieren */
#recharge-card {
    bottom: 1cm;
    left: 1cm;
}

.brand-img { width: 70px; height: auto; margin-bottom: 20px; }

/* Formular-Elemente */
.form-group { margin-bottom: 15px; text-align: left; }
label { display: block; margin-bottom: 5px; font-size: 0.65rem; color: #666; text-transform: uppercase; }
input { 
    width: 100%; 
    background: rgba(21, 21, 21, 0.9); 
    border: 1px solid #333; 
    border-radius: 6px; 
    padding: 10px; 
    color: #fff; 
    outline: none; 
    font-size: 0.9rem;
}
input:focus { border-color: #ffd700; }

.btn-gold { 
    width: 100%; 
    background: linear-gradient(135deg, #ffd700 0%, #ff9900 100%); 
    color: #000; border: none; padding: 14px; border-radius: 8px; 
    font-weight: bold; font-size: 0.9rem; cursor: pointer; text-transform: uppercase; 
}
.btn-link { background: transparent; border: none; color: #555; cursor: pointer; font-size: 0.75rem; margin-top: 10px; }