#dataFrame {
    margin: 0 auto;
    width: 100%;
}

section {
    float: none;
}

body {
    background: linear-gradient(135deg, rgba(245, 196, 196, 0.21) 0%, rgba(176, 113, 241, 0.29) 100%);
    min-height: 100vh;
}

#header-content {
    background-image: none;
}

.image-container {
    display: none;
}

div.flash {
    margin: 20px auto;
    width: auto;
    min-width: 50%;
    max-width: 80%;
    padding: 20px 40px;
    white-space: nowrap;
}

div.page-header {
    text-align: center;
    margin: 20px auto !important;
    padding: 10px;
    width: 100% !important;
}

.logo {
    margin-bottom: -5px;
    display: block;
}

.middle-header {
    width: clamp(300px, 100%, 350px) !important;
    margin: 100px auto 60px !important; /* Уменьшил верхний отступ */
    text-align: center;
    display: block;
}

/*** Login Form ***/

div.login {
    background: linear-gradient(135deg, rgba(246, 215, 168, 0.36) 0%, rgba(185, 123, 241, 0.26) 100%);
    border: 1px solid #800;
    border-radius: 8px;
    width: 280px;
    margin: 0 auto;
    padding: 20px;
}

div.login label {
    display: block;
    font-family: Arial, sans-serif, Helvetica, 'Helvetica Neue', "Segoe UI";
    font-size: 16px;
    color: #666;
    margin-bottom: 5px;
}

div.login label.control-label {
    font-weight: bold;
}

div.login input[type="text"],
div.login input[type="password"] {
    width: 100%;
    padding: 8px;
    box-sizing: border-box;
    border: 1px solid #ccc;
    border-radius: 4px;
}

div.login input[type="checkbox"],
div.login input[type="radio"] {
    margin: 1px 10px 8px -20px;
}

div.login div.checkbox label {
    font-size: 13px;
    margin-left: 14px;
}

div.login p {
    font-size: 11px;
    margin: 10px 0 0;
}

/* Стили для контейнера пароля */
/*.password-wrapper {*/
/*    position: relative;*/
/*    width: 100%;*/
/*}*/

.password-input {
    width: 100%;
    padding-right: 40px !important;
    box-sizing: border-box;
}

/*.password-toggle {*/
/*    position: absolute;*/
/*    right: 8px;*/
/*    top: 50%;*/
/*    transform: translateY(-50%);*/
/*    background: none;*/
/*    border: none;*/
/*    cursor: pointer;*/
/*    padding: 4px;*/
/*    z-index: 10;*/
/*    width: 30px;*/
/*    height: 30px;*/
/*    display: flex;*/
/*    align-items: center;*/
/*    justify-content: center;*/
/*}*/

/*.password-toggle .eye-icon {*/
/*    font-size: 18px;*/
/*    user-select: none;*/
/*}*/

/*.password-toggle:hover .eye-icon {*/
/*    transform: scale(1.1);*/
/*}*/

/* Остальные стили */
div.password-rules {
    background-color: #eeeeee;
    border: 1px solid #888;
    width: 50%;
    margin: 20px auto;
    padding: 20px;
    text-align: center;
}

div.password-rules h3 {
    font-size: 14px;
    text-align: center;
    color: #a52a2a;
}

div.password-rules h4 {
    text-align: center;
    color: #0000ff;
}

div.password-rules p {
    font-size: 12px;
}

div.password-rules p.extra {
    font: bold 16px Arial, sans-serif;
}

div.reset {
    width: 340px;
}

div.reset h1,
div.message h1 {
    font-size: 14px;
    margin: 0 0 20px;
}

div.message {
    width: 800px;
}

div.message * {
    text-align: center;
}

div.message h3 {
    margin: 0;
}

div.token {
    width: 100%;
    text-align: center;
    font-size: 12px;
}