/* school people filter */

.school-people-filter.parents .parents-export                         { white-space: nowrap; }
.school-people-filter.parents .parents-export > *                     { display: inline-block; vertical-align: middle; margin-left: 0; }
.school-people-filter.parents .parents-export > label                 { font-size: 14px; color: #228dcf; }
.school-people-filter.parents .parents-export > .classowl-input-frame { width: 200px; margin-bottom: 0; }
.school-people-filter.parents .parents-export > button                { width: 100px; }

/* school people list */

.people-list.parents > table > thead > tr > th:last-child   { text-align: left; }
.people-list.parents > table > tbody > tr > td              { width: auto; }

.people-list.parents td.user-name    { width: 25%; }
.people-list.parents td.user-subitem { min-width: auto; max-width: auto; font-size: 0; }

.people-list.parents td.user-subitem > .parent-item        { display: inline-block; vertical-align: middle; width: 25%; font-size: 0; }
.people-list.parents td.user-subitem > .parent-item a      { display: block; text-decoration: none; }
.people-list.parents td.user-subitem > .parent-item a > *  { display: inline-block; vertical-align: middle; }
.people-list.parents td.user-subitem > .parent-item .photo { width: 24px; height: 24px; border-radius: 50%; background: no-repeat center center; background-size: cover; }
.people-list.parents td.user-subitem > .parent-item .name  { margin-left: 10px; font-size: 14px; width: calc(100% - 24px - 10px); }
.people-list.parents td.user-subitem > .parent-item .photo { position: relative; overflow: hidden; }
.people-list.parents td.user-subitem > .parent-item .photo > .icon { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
.people-list.parents td.user-subitem > .parent-item .photo > .icon { width: 26px; height: 24px; line-height: 22px; text-align: center; font-size: 12px; }

.people-list.parents td.user-subitem > .parent-item.add        .name          { color: #10B163; }
.people-list.parents td.user-subitem > .parent-item.add        .photo > .icon { color: #10B163; background-color: rgba(16,177,99,.2); }
.people-list.parents td.user-subitem > .parent-item.edit       .name          { color: #657FAC; }
.people-list.parents td.user-subitem > .parent-item.edit       .photo > .icon { color: #fff; background-color: rgba(0,68,205,.8); }
.people-list.parents td.user-subitem > .parent-item.edit       .photo > .icon { opacity: 0; }
.people-list.parents td.user-subitem > .parent-item.edit:hover .photo > .icon { opacity: 1; }

/* modal parents edit */

.modal-form.modal-parents-edit .container     { width: 640px; }
.modal-form.modal-parents-edit .inner .button { width: 100px; margin-left:  auto; }

.modal-form.modal-parents-edit .classowl-input-frame > .image.empty { background: #c9ebde url('/static/img/icon/parent-photo.svg') no-repeat center center; background-size: 40%; }

.modal-form.modal-parents-edit .form-row                      { position: relative; font-size: 0; }
.modal-form.modal-parents-edit .form-row > div                { display: inline-block; vertical-align: bottom; }
.modal-form.modal-parents-edit .form-row > .form-image        { width: 45px; height: 45px; border-radius: 50%; background: #c9ebde url('/static/img/icon/parent-photo.svg') no-repeat center center; background-size: 40%; }
.modal-form.modal-parents-edit .form-row > .form-image .image { width: 45px; height: 45px; border-radius: 50%; }
.modal-form.modal-parents-edit .form-row > .form-image .image { background: no-repeat center center; background-size: cover; }
.modal-form.modal-parents-edit .form-row > .form-input        { width: 123px; margin-left: 15px; }
.modal-form.modal-parents-edit .form-row > .form-email        { width: 206px; margin-left: 15px; }
.modal-form.modal-parents-edit .form-row > .form-ctrls        { width: 36px; margin-left: 10px; font-size: 0; }
.modal-form.modal-parents-edit .form-row > .form-ctrls a      { display: block; width: 36px; height: 36px; line-height: 36px; text-align: center; font-size: 18px; color: #ef4949; }

.modal-form.modal-parents-edit .form-row        > .form-ctrls { display: inline-block; }
.modal-form.modal-parents-edit .form-row.empty  > .form-ctrls { display: none; }
.modal-form.modal-parents-edit .form-row        > .form-ctrls > .ctrl-change { display: none; }
.modal-form.modal-parents-edit .form-row.change > .form-ctrls > .ctrl-change { display: block; }
.modal-form.modal-parents-edit .form-row.change > .form-ctrls > .ctrl-delete { display: none; }

.modal-form.modal-parents-edit .parents-import       { float: right; display: block; margin-right: 40px; line-height: 24px; }
.modal-form.modal-parents-edit .parents-import label { cursor: pointer; }
.modal-form.modal-parents-edit .parents-import span  { font-size: 14px; color: #0044CD; }
.modal-form.modal-parents-edit .parents-import input { display: none; }