/* region button */
button, .button {
    border: none;
    transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
    background: var(--content-background-color);
    color: var(--content-text-color);
    box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 1px -2px, rgba(0, 0, 0, 0.14) 0px 2px 2px 0px, rgba(0, 0, 0, 0.12) 0px 1px 5px 0px;
}
button.primary, .button.primary {
    background: var(--primary-background-color);
    color: var(--button-text-color);
}
button.accent, .button.accent {
    background: var(--accent-background-color);
    color: var(--button-text-color);
}
button.warn, .button.warn {
    background: var(--warn-background-color);
    color: var(--button-text-color);
}
button:disabled, .button.disabled {
    background: var(--disabled-background-color);
    color: var(--disabled-text-color);
    box-shadow: none;
}
.a.disabled {
    color: var(--disabled-text-color);
}
button.secondary, .button.secondary {
    background: var(--disabled-background-color);
    color: var(--primary-text-color);
    box-shadow: none;
}
button.button-small, .button.button-small{
    padding: 0 10px;
    min-width: auto;
}
button.transparent, .button.transparent, .button.button-transparent, button.button-transparent{
    background: none;
    box-shadow: none;
}
/* endregion button */

/* region badge */
.badge {
    border: 1px solid var(--content-border-color);
    background: var(--content-background-color);
    color: var(--content-text-color);
}

.badge.primary {
    border: none;
    background: var(--primary-background-color);
    color: var(--content-text-color);
}

.badge.accent {
    border: none;
    background: var(--accent-background-color);
    color: var(--white-text-color);
}

.badge.highlight {
    border: none;
    background: var(--highlight-background-color);
    color: var(--content-text-color);
}

.badge.warn {
    border: none;
    background: var(--warn-background-color);
    color: var(--white-text-color);
}

.badge.disabled {
    border: none;
    background: var(--disabled-background-color);
    color: var(--disabled-text-color);
}
/* endregion badge */

/* region item-card */
.item-card .item-card-date i {
    color: var(--icon-color);
}
.item-card .item-card-date {
    color: var(--accent-text-color);
}
.item-card .item-card-user {
    background: var(--basic-background-color);
    color: var(--secondary-text-color);
}
.item-card .item-card-image {
    color: var(--icon-color);
}
.item-card .item-card-title {
    color: var(--content-text-color);
}
.item-card .item-card-subtitle {
    color: var(--secondary-text-color);
}
/* endregion item-card */

/* region content-card */
.content-card {
    box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.1) 0px 4px 6px -4px;
    background: var(--content2-background-color);
}
.content-card .content-card-header {
    background: var(--content-background-color);
    border-bottom: 1px solid var(--content-border-color);
    color: var(--content-text-color);
}
.content-card .content-card {
    background: var(--content-background-color);
}

.content-card .content-card-subtitle {
    color: var(--accent-text-color);
}

.content-card .content-card-title {
    color: var(--primary-text-color);
    font-size: 18px;
    font-weight: normal;
}

.content-card .content-card-subtitle {
    color: var(--secondary-text-color);
    font-weight: normal;
    font-size: 13px;
}
.content-card .content-card-header .page-title i {
    margin-top: 0;
}
/* endregion content-card*/

/* region fieldblocks */
.fieldblock-has-error .fieldblock-error {
    color: var(--warn-text-color);
}
.fieldblock-has-error input[type=text],
.fieldblock-has-error input[type=password],
.fieldblock-has-error select,
.fieldblock-has-error textarea{
    border-color: var(--fieldblock-warn-border-color);
}

.fieldblock-has-error .tox.tox-tinymce{
    border: 1px solid var(--fieldblock-warn-border-color);
    border-radius: 8px;
}

.fieldblock-has-error input {
    border-color: var(--fieldblock-warn-border-color);
}
.fieldblock-has-error .fieldblock-error {
    position: absolute;
    bottom: -18px;
    font-size: 12px;
    font-weight: 500;
    line-height: 16px;
    color: var(--warn-text-color);
}
.modal-form-container .fieldblock-has-error .fieldblock-error {
    position: initial;
}
.modal-form-container .button.primary {
    width: 100%;
}
.fieldblock .toggle-password {
    position: absolute;
    height: 48px;
    width: 48px;
    opacity: 0.3;
    top: 25px;
    right: 0;
    cursor: pointer;
    z-index: 1;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.fieldblock-checkbox .fieldblock-error {
    display: none;
}
.fieldblock.fieldblock-required > label:after {
    content: "*";
    color: var(--warn-text-color);
    margin-left: 3px;
}
.fieldblock.fieldblock-checkbox label {
    margin: 1px 0 0 5px;
}
.fieldblock.fieldblock-horizontal > label {
    line-height: 48px;
}
/* endregion fieldblocks */

/* region flex-table */
.flex-table .flex-table-title {
    background: var(--content3-background-color);
    color: var(--secondary-text-color);
}
.flex-table.stripped .flex-table-body .flex-table-row:nth-child(2n) {
    background: var(--content3-background-color);
}
/* endregion flex-table */

/* region widgets */
/* file-selector */
.file-selector-widget .file-selector-widget-input input{
    display: none;
}
.file-selector-widget .file-selector-clear-button{
    position: absolute;
    bottom: 10px;
    right: 5px;
    background: transparent;
    box-shadow: none;
    padding: 3px;
    min-width: 0;
    min-height: 0;
    line-height: 1;
}

/* modal-widget */
.modal-background {
    background: var(--disabled2-background-color);
    opacity: 1;
}

.modal-window {
    box-shadow: rgba(0, 0, 0, 0.2) 0px 11px 15px -7px, rgba(0, 0, 0, 0.14) 0px 24px 38px 3px, rgba(0, 0, 0, 0.12) 0px 9px 46px 8px;
    background: var(--content-background-color);
    color: var(--secondary-text-color);
}

.modal-window-title {
    color: var(--primary-text-color);
}

#showMessageForm .modal-window{
    width: 540px;
}

/* endregion widgets */

.store-item-card-buttons .add-to-card-button {
    margin: 0 5px;
}

@media (max-width: 800px) {
    .fieldblock .toggle-password{
        height: 32px;
    }
}

@media (max-width: 630px) {
    .store-item-card-buttons {
        flex-direction: column;
    }

    .store-item-card-buttons .button {
        margin: 10px 0;
        width: 100%;
    }
}