/* Formular login */
.login-form input[type="text"],
.login-form input[type="password"] {
    width: 120px;
    height: 20px;
    padding: 2px 4px;
    border: 1px solid #6a4b21;
    border-radius: 4px;
    box-sizing: border-box;
    font-size: 13px;
    font-weight: normal;
}

.login-form .record-table td {
    border-radius: 4px;
    padding: 3px;
}

.login-form .record-table td:first-child {
    width: 20px;
    font-size: 13px;
    font-weight: bold;
    white-space: nowrap;
}

.login-form button[type="submit"] {
    width: 90px;
    height: 30px;
    padding: 2px 5px;
    border: 1px solid #ffffff;
    border-radius: 5px;
    background-color: #ff7f50;
    color: #ffffff;
    font-size: 13px;
    font-weight: bold;
    cursor: pointer;
}

.login-form button[type="submit"]:hover {
    background-color: #4f3718;
}

/*
 * Culorile butoanelor de fundal deja existente.
 * Aceste reguli nu creeaza alte butoane si nu modifica interiorul tabelului.
 */
button[data-background],
button[data-fundal] {
    border: 2px solid #ffffff;
    border-radius: 5px;
    color: #000000;
    font-size: 12px;
    font-weight: bold;
    cursor: pointer;
}

button[data-background="1"],  button[data-fundal="1"],  #background1Btn,  #fundal1 { background-color: #d2c578; }
button[data-background="2"],  button[data-fundal="2"],  #background2Btn,  #fundal2 { background-color: #e6e697; }
button[data-background="3"],  button[data-fundal="3"],  #background3Btn,  #fundal3 { background-color: #d0f7d3; }
button[data-background="4"],  button[data-fundal="4"],  #background4Btn,  #fundal4 { background-color: #dbefa3; }
button[data-background="5"],  button[data-fundal="5"],  #background5Btn,  #fundal5 { background-color: #ffde75; }
button[data-background="6"],  button[data-fundal="6"],  #background6Btn,  #fundal6 { background-color: #f4e07b; }
button[data-background="7"],  button[data-fundal="7"],  #background7Btn,  #fundal7 { background-color: #ffffff; }
button[data-background="8"],  button[data-fundal="8"],  #background8Btn,  #fundal8 { background-color: #a9b37b; }
button[data-background="9"],  button[data-fundal="9"],  #background9Btn,  #fundal9 { background-color: #9faa6c; }
button[data-background="10"], button[data-fundal="10"], #background10Btn, #fundal10 { background-color: #94caa6; }
button[data-background="11"], button[data-fundal="11"], #background11Btn, #fundal11 { background-color: #95bc8c; }
button[data-background="12"], button[data-fundal="12"], #background12Btn, #fundal12 { background-color: #83a697; }

button[data-background]:hover,
button[data-fundal]:hover,
[id^="background"][id$="Btn"]:hover,
[id^="fundal"]:hover {
    border-color: #4f3718;
    transform: scale(1.05);
}

button[data-background].selected,
button[data-fundal].selected,
[id^="background"][id$="Btn"].selected,
[id^="fundal"].selected {
    border-color: #ff5e4d;
    box-shadow: 0 0 0 3px rgba(255, 94, 77, 0.4);
}