.save-button{
    display: block;
    width: 80px;
    margin: 10px auto 0 auto;
    background-color: #9f5ef2; /* Ein helles Blau */
    color: white;             /* Weiße Schriftfarbe */
    border: none;
    text-align: center;
    text-decoration: none;
    font-size: 14px;
    cursor: pointer;          /* Zeigt eine Hand an, wenn man drüberfährt */
    border-radius: 5px;
    transition: background-color 0.3s ease, transform 0.1s ease; /* Übergang für den Hover-Effekt */
}
/* ️ Der Hover-Effekt */
.save-button:hover {
    background-color: #7c43c7; /* Dunkleres Blau beim Hover */
    font-weight: bold;         /* Optional: Text etwas dicker */
}

/* ️ Optional: Effekt beim tatsächlichen Klicken (Active State) */
.save-button:active {
    background-color: #63329e; /* Noch dunkleres Blau */
    transform: translateY(1px); /* Lässt den Button leicht einsinken */
}

/* Optional: Abstand zwischen Icon und Text */
.save-button .icon-spacer {
    margin-right: 8px;
}
/* BACK */
#back {
    /* Layout und Positionierung */
    display: block;
    width: 80px;
    margin: 20px auto 0 auto;
    text-align: center;
    cursor: pointer;
    
    /* Optik (Standard: Orange) */
    text-decoration: none;
    background-color: #FFC107; /* Helles, warmes Orange */
    color: #333;               /* Dunkle Schriftfarbe (besserer Kontrast auf hellem Orange) */
    border: solid 1px #FFB300;  /* Passender, leicht dunklerer Rahmen */
    padding: 8px 0;
    
    /* Sanfte Übergänge für Animationen */
    transition: background-color 0.3s ease, 
                color 0.3s ease, 
                border-radius 0.3s ease,
                box-shadow 0.3s ease; /* Übergang auch für den Schatten */

    border-radius: 5px;
}

/* ️ Der Hover-Effekt: Dunkler werden */
#back:hover {
    background: #FFA000;       /* Satteres, dunkleres Orange */
    color: #333;               /* Schriftfarbe bleibt dunkel */
    border-color: #E68A00;     /* Rahmenfarbe noch etwas dunkler */
    border-radius: 5px; 
    
    /* Leichter Schatten, der den Button hervorhebt */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); 
}

/* ️ Effekt beim Klicken (Active State) */
#back:active {
    background: #E68A00;       /* Die dunkle Farbe wird sofort angewendet */
    transform: translateY(1px); /* Button sinkt leicht ein */
    box-shadow: none;           /* Schatten verschwindet beim Klicken */
}

/* Abstand zwischen Icon und Text */
#back i.fa-arrow-left {
    margin-right: 5px;
}