/* kc-public.css - Modernes, edles Design für das KruemelCoin User-Interface */

/* --- Allgemeine Stile für das User-Interface --- */
.kc-wallet-container {
    display: grid;
    grid-template-columns: 1fr;
    gap: 30px;
    margin-top: 20px;
    /* Stellt sicher, dass das Layout nicht durch Theme-Container gestört wird */
    max-width: 100%;
    box-sizing: border-box;
}

@media (min-width: 768px) {
    .kc-wallet-container {
        grid-template-columns: 1fr 1fr;
    }
    .kc-transactions-card {
        grid-column: 1 / -1; /* Nimmt die volle Breite ein */
    }
}

.kc-card {
    background: #ffffff;
    border-radius: 12px;
    padding: 30px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
    border: 1px solid #e0e0e0;
    /* Höhere Spezifität */
    margin: 0 !important;
}

.kc-card h2 {
    font-size: 1.5em;
    color: #333;
    margin-top: 0;
    padding-bottom: 10px;
    border-bottom: 1px solid #f0f0f0;
    font-weight: 600;
}

/* Balance Card */
.kc-balance-amount {
    font-size: 3em;
    font-weight: 700;
    color: #0073aa !important; /* Edle Farbe - !important für Robustheit */
    margin: 10px 0 5px 0 !important;
    /* Sicherstellen, dass die Zahl nicht ausgegraut wird */
    opacity: 1 !important;
}

.kc-currency {
    font-size: 0.6em;
    font-weight: 400;
    vertical-align: super;
    margin-left: 5px;
    opacity: 0.8;
}

.kc-wallet-address {
    font-size: 0.9em;
    color: #666;
}

/* Send Card */
.kc-form-group {
    margin-bottom: 15px;
}

.kc-form-group label {
    display: block;
    font-weight: 500;
    margin-bottom: 5px;
    color: #555;
}

.kc-send-card input[type="text"],
.kc-send-card input[type="number"] {
    width: 100%;
    padding: 10px;
    border: 1px solid #ddd !important;
    border-radius: 6px !important;
    box-sizing: border-box !important;
    font-size: 1em !important;
    transition: border-color 0.3s;
    background-color: #fff !important; /* Wichtig für dunkle Themes */
    color: #333 !important; /* Wichtig für dunkle Themes */
}

.kc-send-card input:focus {
    border-color: #0073aa !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(0, 115, 170, 0.1) !important;
}

.kc-button {
    display: inline-block;
    padding: 10px 20px;
    border: none !important;
    border-radius: 6px !important;
    cursor: pointer !important;
    font-weight: 600 !important;
    text-align: center !important;
    text-decoration: none !important;
    transition: background-color 0.3s, opacity 0.3s;
}

.kc-button-primary {
    background-color: #0073aa;
    color: #fff;
}

.kc-button-primary:hover {
    background-color: #005a87;
}

/* Transaktionsverlauf */
.kc-transaction-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 15px;
    font-size: 0.95em;
}

.kc-transaction-table th, .kc-transaction-table td {
    padding: 12px 15px !important;
    text-align: left !important;
    border-bottom: 1px solid #eee !important;
}

.kc-transaction-table th {
    background-color: #f9f9f9;
    font-weight: 600;
    color: #555;
}

.kc-credit {
    color: #46b450; /* Grün für Gutschrift */
    font-weight: 600;
}

.kc-debit {
    color: #dc3232; /* Rot für Lastschrift */
    font-weight: 600;
}

/* Nachrichten */
.kc-message {
    padding: 10px;
    margin-top: 15px;
    border-radius: 6px;
    font-weight: 500;
}

.kc-message.kc-success {
    background-color: #e6ffe6;
    color: #46b450;
    border: 1px solid #46b450;
}

.kc-message.kc-error {
    background-color: #ffe6e6;
    color: #dc3232;
    border: 1px solid #dc3232;
}

/* --- Widget Stile --- */
.kc-widget-content {
    padding: 10px 0 !important;
    border-top: 1px solid #eee !important;
}

.kc-widget-balance {
    text-align: center;
    margin: 10px 0 15px 0;
    padding: 10px;
    background-color: #f9f9f9;
    border-radius: 6px;
}

.kc-widget-label {
    display: block;
    font-size: 0.85em;
    color: #777;
    margin-bottom: 3px;
}

#kc-widget-balance-amount {
    font-size: 1.4em !important;
    color: #0073aa !important;
    font-weight: 700 !important;
}

.kc-widget-actions {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.kc-widget-button {
    flex-grow: 1;
    padding: 8px 10px;
    font-size: 0.9em;
    text-align: center;
    border-radius: 4px;
    text-decoration: none;
    font-weight: 500;
}

.kc-button-send {
    background-color: #0073aa;
    color: #fff;
}

.kc-button-send:hover {
    background-color: #005a87;
    color: #fff;
}

.kc-button-history {
    background-color: #f0f0f0;
    color: #333;
    border: 1px solid #ddd;
}

.kc-button-history:hover {
    background-color: #e0e0e0;
}