:root {
            --asb-yellow: #ffed00;
            --asb-dark-grey: #333333;
            --asb-light-grey: #f8f9fa;
        }
        body {
            background-color: var(--asb-light-grey);
        }
        .navbar-brand img {
            max-height: 40px;
        }
        .card {
            border: none;
            box-shadow: 0 4px 8px rgba(0,0,0,0.1);
        }
        .card-header {
            background-color: var(--asb-yellow);
            color: var(--asb-dark-grey);
            font-weight: bold;
            border-bottom: none;
        }
        .btn-primary {
            background-color: yellow;
            border-color: red;
			color:black; 
        }
        .btn-primary:hover {
            background-color: #555555;
            border-color: #555555;
        }
        .form-select:focus {
            border-color: var(--asb-yellow);
            box-shadow: 0 0 0 0.25rem rgba(255, 237, 0, 0.5);
        }

		.container2 { max-width: 1400px; margin: 20px auto; padding: 20px; border: 1px solid #ddd; border-radius: 8px; background-color:white; }
        .post { border-bottom: 1px solid #eee; padding: 15px 0; }
        .post:last-child { border-bottom: none; }
        .post-info { font-size: 0.9em; color: #888; }
        .delete-link { float: right; color: #e74c3c; text-decoration: none; }
        textarea { width: 100%; padding: 10px; border-radius: 4px; border: 1px solid #ccc; box-sizing: border-box; }
        button { background-color: #3498db; color: white; padding: 10px 15px; border: none; border-radius: 4px; cursor: pointer; }
        button:hover { background-color: #2980b9; }
		.comments-section { margin-top: 15px; padding-left: 20px; border-left: 2px solid #f0f0f0; }
		.comment { font-size: 0.95em; margin-bottom: 8px; }
		.comment span { color: #555; }
		.comment-form { margin-top: 10px; display: flex; }
		.comment-form input[type="text"] { flex-grow: 1; border: 1px solid #ccc; padding: 8px; border-radius: 4px 0 0 4px; }
		.comment-form button { border-radius: 0 4px 4px 0; }

				
.login-container {
    max-width: 400px;
    width: 100%;
}

.login-box {
    background-color: #fff;
    padding: 2.5rem;
    border-radius: 15px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

.login-logo img {
    max-width: 200px;
    height: auto;
}

.asb {
    /* Default State */
    background-color: #ffee00;    /* Gelber Hintergrund */
    border: 2px solid #e30613;       /* Roter Rahmen */
    color: red !important;       /* Rote Schrift mit !important */
    padding: 10px 20px;          /* Innenabstand für bessere Optik */
    font-size: 16px;             /* Schriftgröße */
    cursor: pointer;             /* Zeigt einen Klick-Cursor an */
    transition: all 0.3s ease;   /* Sanfter Übergang für den Effekt */
}

/* Hover State (when the mouse is over the button) */
.asb:hover {
    background-color: #e30613;       /* Roter Hintergrund */
    border-color: #ffee00;        /* Gelber Rahmen */
    color: yellow !important;    /* Gelbe Schrift mit !important */
}