/* =====================================================
   1. GLOBAL / BASE
===================================================== */

#wpdcom {
    --wpd-text-color: #0D0D0D;
    --wpd-accent-color: rgb(88, 171, 232);
}


/* =====================================================
   2. EDITOR / TEXTAREA
===================================================== */

/* Placeholder */
.ql-editor.ql-blank::before {
    color: #ccc;
}

#wpdcom .ql-editor::before {
    color: black;
}

/* Textarea */
#wpdcom .wpd-form .wpdiscuz-textarea-wrap textarea {
    color: black;
    border: none;
    border-bottom: 1px solid black;
    border-radius: 0;
    box-shadow: none;
    min-height: 1.5em;
    margin-bottom: 0;
    vertical-align: baseline;
}

/* Character counter */
#wpdcom .wpd-editor-char-counter {
    padding: 4px 5px 5px;
    right: 1%;
    bottom: 2px;
}


/* =====================================================
   3. BUTTONS & FORM
===================================================== */

#wpdcom .wpd-prim-button {
    background-color: #eee;
    border: 1px solid black;
    border-radius: 15px;
    padding: 2px 13px;
    opacity: 1;
    font-family: "Roboto" !important;
    letter-spacing: normal;
}

#wpdcom .wc-field-submit input[type="submit"] {
    text-transform: none;
}

#wpdcom .wc-field-submit input[type="submit"]:active {
    background-color: silver !important;
}

#wpdcom .wpd-form.wpd-secondary-form-wrapper {
    margin-bottom: 0;
}

#wpdcom .wpd-form-col-left .wpd-field-group .wpd-field-group-title {
    padding: 0;
}


/* =====================================================
   4. COMMENT LAYOUT
===================================================== */

#wpdcom .wpd-comment .wpd-comment-wrap {
    padding-bottom: 15px;
}

#wpdcom .wpd-comment .wpd-comment-header {
    padding: 5px 0 1px;
}

#wpdcom .wpd-comment-text {
    padding: 0 0 2px;
}

#wpdcom .wpd-comment .wpd-comment-right {
    padding-bottom: 0;
}

#wpdcom .wpd-comment-footer .wpd-vote {
    padding-right: 3px;
}


/* =====================================================
   5. AVATAR & AUTHOR
===================================================== */

#wpdcom .wpd-comment .wpd-avatar img,
#wpdcom .wpd-comment .wpd-avatar img.avatar,
#wpdcom .wpd-comment.wpd-reply .wpd-avatar img,
#wpdcom .wpd-comment.wpd-reply .wpd-avatar img.avatar {
    width: 40px;
    height: 40px;
    border: none;
    background-color: transparent;
}

/* Author name */
#wpdcom .wpd-comment-header .wpd-comment-author {
    margin-right: 3%;
}

#wpdcom .wpd-blog-post_author .wpd-comment-author,
#wpdcom .wpd-blog-post_author .wpd-comment-author a,
#wpdcom .wpd-blog-administrator .wpd-comment-author,
#wpdcom .wpd-blog-administrator .wpd-comment-author a,
#wpdcom .wpd-blog-newbie .wpd-comment-author,
#wpdcom .wpd-blog-newbie .wpd-comment-author a {
    color: var(--wpd-text-color);
}


/* =====================================================
   6. META / DATE / CUSTOM FIELD
===================================================== */

#wpdcom .wpd-comment-date {
    float: right;
    margin-right: 10px;
}

#wpdcom .wpd-comment-right .wpd-comment-last-edited {
    margin: 2px 0;
}

.wpd-custom-field {
    display: inline;
    width: auto;
}

.wpd-cf-value {
    padding: 0;
    border: none;
    font-size: 10px;
    opacity: 1;
}


/* =====================================================
   7. REPLY / LINKS
===================================================== */

#wpdcom.wpd-layout-1 .wpd-comment .wpd-reply-to {
    border-left: none;
    padding: 0;
}

#wpdcom .wpd-comment .wpd-reply-to a {
    opacity: 1;
    color: var(--wpd-accent-color);
}

#wpdcom .wpd-comment .wpd-reply-to a:hover {
    color: var(--wpd-accent-color);
}