img {
    display: inline-block;
    max-width: 100%;
    height: auto;
    object-fit: cover;

    &:not([alt]) {
        --error: "Image require alt card";
        cursor: help;
        outline: 1px solid red;
    }

    &.fancybox-image:not([alt]) {
        outline: none;
    }

    &.alignleft {
        float: #{$left};
        @media (max-width: 30em) {
            float: none;
            margin: 0;
        }
    }

    &.alignright {
        float: #{$right};
        @media (max-width: 30em) {
            float: none;
            margin: 0;
        }
    }
}

.alignleft {
    display: inline;
    float: #{$left};
    margin: rem(20px 20px 20px 0);

    .wp-block-image & {
        @media (max-width: $screen-sm) {
            float: none;
            text-align: center;
        }
    }
}

.alignright {
    display: inline;
    float: #{$right};
    margin: rem(20px 0 20px 20px);

    .wp-block-image & {
        @media (max-width: $screen-sm) {
            float: none;
            text-align: center;
        }
    }
}

//== Default wp
.has-drop-cap:not(:focus):after {
    padding-top: 0;
}

video {
    height: auto;
    max-width: 100%;
    object-fit: cover;
}

p {
    margin-bottom: rem($body_mgb_tag_p);

    & + .wp-block-gallery {
        margin-top: rem(25px);
    }
}

b, strong {
    font-weight: 700;
}

dl, ol, ul {
    padding: 0 0 15px 15px;
    margin-bottom: rem(15px);

    &.wp-block-gallery {
        padding-#{$left}: 0;
    }
}

dl {
    padding-left: 0;
}

.page {
    mark {
        background-color: rgba($primary_color, .3);
    }
}

figure {
    margin: rem(0 10px 10px 0);
}

table {
    margin: rem(0 0 25px);
    width: 100%;
}

tr {
    &:not(:last-child) {
        border-bottom: 1px solid $border_color;
    }
}

th, td {
    padding: rem(12px 8px 12px);

    &:first-child {
        padding-left: 0;
    }

    a {
        color: $highlight_color;
    }
}

select {
    width: 100%;
}

//== Gallery
.gallery-item {
    display: inline-block;
    width: 50%;
    text-align: #{$left};
    vertical-align: top;
    margin: rem(0 0 15px);
    padding: rem(0 15px 0 0);

    .gallery-columns-1 & {
        max-width: 100%;
        width: 100%;
    }

    .gallery-columns-2 & {
        max-width: 50%;
    }

    .gallery-columns-3 & {
        max-width: 33.33%;
    }

    .gallery-columns-4 & {
        max-width: 25%;
    }

    .gallery-columns-5 & {
        max-width: 20%;
    }

    .gallery-columns-6 & {
        max-width: 16.66%;
    }

    .gallery-columns-7 & {
        max-width: 14.28%;
    }

    .gallery-columns-8 & {
        max-width: 12.5%;
    }

    .gallery-columns-9 & {
        max-width: 11.11%;
    }

    .wp-caption-text {
        padding-#{$right}: 0;
    }
}

//== figcaption wp
.wp-caption, .gallery-caption, .wp-block-image figcaption {
    max-width: 100%;
    margin-bottom: rem(20px);
    color: $disable_color;
    font-size: rem(12px);
}

.wp-caption .wp-caption-text {
    margin: rem(10px 0);
}

.wp-caption, .gallery-caption {
    color: $disable_color;
    font-size: rem(12px);
    margin-bottom: rem(20px);
    max-width: 100%;
}

.gallery-caption {
    display: block;
    text-align: #{$left};
    padding: rem(0 10px 0 0);
    margin-bottom: 0;
}

.wp-caption-text {
    margin-top: 5px;
}

//== Default wp
.bypostauthor {
    display: block;
}

.aligncenter {
    clear: both;
    display: block;
    margin: rem(20px auto);
}

li {
    line-height: 2.286; //== 32px

    > ul, > ol {
        margin-top: rem(7px);
        margin-bottom: 0;
        padding-bottom: 0;
    }
}

iframe {
    width: 100%;
}

label {
    display: block;
    font-weight: 700;
    color: $heading_color;
    margin-bottom: rem(10px);
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
    color: $body_color;
    background: $gray_scheme;
    border: 1px solid $border_color;
    padding: rem(11px 20px);
    width: 100%;
    @include transition(all .3s ease);

    &:focus {
        outline: none;
        border-color: $highlight_color;
    }
}

button,
input[type="button"],
input[type="submit"] {
    font-family: $heading_font;
    font-size: rem(14px);
    font-weight: 700;
    text-align: center;
    color: $light_color;
    background: $primary_color;
    border: 0;
    cursor: pointer;
    @include transition(all .3s ease);

    &:focus {
        outline: none;
    }

    &:hover {
        background: $hover_color;
    }
}

form {
    input[type="checkbox"] {
        @include checkbox-label();

        & + label {
            margin-top: 0 !important;
            padding-left: 0 !important;
        }
    }
}

input[type=number] {
    -moz-appearance: textfield;
}

input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
}