/*==============================================================================
    RakaPuckar Comments
==============================================================================*/

/* WRAPPER */

.comments {
    width: 100%;
    margin-top: 0;
}

/* TITLE */

.td-comments-title-wrap {
    margin-bottom: 10px;
}

.td-comments-title {
    margin: 0 !important;
    padding: 16px;
    background: #f8f8f8;
    border: 1px solid #e6e6e6;
    border-radius: 6px;
    box-sizing: border-box;
}

.td-comments-title span {
    font-family: "Fira Sans Condensed", sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: #18242c !important;
    background: transparent !important;
    padding: 0 !important;
    line-height: inherit !important;
}

/* REMOVE DEFAULT LISTS */

.comment-list,
.comment-list ul,
.comment-list li {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* COMMENT CONTAINER */

.comment article {
    position: relative;
    display: block;
    padding: 16px;
    margin-bottom: 10px;
    border: 1px solid #e6e6e6;
    border-radius: 6px;
    background: #fff;
    box-sizing: border-box;
}

.comment > article > .comment-content,
.comment > article > .comment-meta,
.comment > article > .comment-respond,
.children .comment > article > .comment-content,
.children .comment > article > .comment-meta,
.children .comment > article > .comment-respond {
    margin-left: 92px;
    display: block;
}

/* COMMENT HEADER */

.comment footer {
    position: relative;
    min-height: 72px;
    margin-bottom: 0;
    padding-top: 2px;
}

.comment footer .avatar,
.comment .children .comment .avatar {
    width: 72px !important;
    height: 72px !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    padding: 4px;
    background: #fff;
    border: 1px solid #e6e6e6;
    box-sizing: border-box;
}

.comment-list > .comment > article > footer,
.children .comment > article > footer {
    padding-left: 88px;
}

.comment footer cite {
    display: inline;
    margin-right: 8px;
    font-family: "Fira Sans Condensed", sans-serif;
    font-size: 15px;
    font-weight: 600;
    font-style: normal;
    line-height: 1.2;
    color: #18242c;
}

.comment footer .comment-link {
    display: inline;
    text-decoration: none;
}

.comment footer .comment-link:hover {
    text-decoration: none;
}

.comment footer time {
    font-family: "Fira Sans Condensed", sans-serif;
    font-size: 13px;
    line-height: 1.2;
    color: #bfbfc3;
}

.comment-edit-link {
    display: block;
    margin-top: 6px;
    padding-left: 0 !important;
    font-family: "Fira Sans Condensed", sans-serif;
    font-size: 13px;
    color: #007ac8;
}

.comment-edit-link:hover {
    color: #18242c !important;
    text-decoration: underline !important;
    text-underline-offset: 4px;
    text-decoration-thickness: 1px;
}

/* COMMENT CONTENT */

.comment-content {
    position: relative;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px dotted #d0d0d0;
    font-family: "Faustina", serif;
    font-size: 15px;
    line-height: 1.7;
    color: #222;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.comment-content p {
    margin: 0 0 14px;
}

.comment-content p:last-child {
    margin-bottom: 0;
}

/* COMMENT LINKS */

.comment-content a,
.comment-content a:visited {
    color: #007ac8 !important;
    text-decoration: underline !important;
    text-underline-offset: 3px;
    text-decoration-thickness: 1px;
}

.comment-content a {
    word-break: break-all;
}

.comment-content a:hover,
.comment-content a:focus {
    color: #18242c !important;
    text-decoration: underline !important;
    text-underline-offset: 3px;
    text-decoration-thickness: 1px;
}

/* COMMENT REPLIES */

.comment-meta {
    margin-top: 14px;
}

.comment-reply-link {
    display: inline-block;
    padding: 3px 8px;
    border: 1px solid #e5e5e5;
    border-radius: 2px;
    background: #fafafa;

    font-family: "Fira Sans Condensed", sans-serif;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: .03em;
    color: #007ac8;
}

.comment-reply-link:hover {
    background: #f2f2f2;
    color: #18242c;
    text-decoration: none;
}

.children {
    margin-left: 30px !important;
    padding-left: 0 !important;
}

/* COMMENT FORM */

.comment-respond {
    clear: both;
    display: block !important;
    margin-top: 10px;
    padding: 16px;
    border: 1px solid #e6e6e6;
    border-radius: 6px;
    background: #fff;
    box-sizing: border-box;
}

#respond.comment-respond {
    margin: 10px 0 0;
}

.comment-respond h3 {
    margin-top: 0;
}

.comment-respond textarea {
    width: 100%;
    box-sizing: border-box;
}

.comment .children {
    border-top: 0 !important;

}

/* MOBILE */

@media (max-width: 767px) {

    .children {
        margin-left: 24px !important;
        padding-left: 0 !important;
    }

    .comment .comment-meta,
    .comment .comment-content,
    .comment .comment-respond {
        margin-left: 0 !important;
    }

    .comment-content {
        padding-left: 0 !important;
    }
	
	
	.comment .children .comment .comment-content,
.comment .children .comment .comment-meta,
.comment .children .comment .comment-respond {
    margin-left: 0 !important;
}
}



/*==============================================================================
    RakaPuckar Comments - Fix nested replies
==============================================================================*/

/* Första svarsnivån */
.comment > .children {
    margin-left: 30px !important;
}

/* Alla djupare nivåer stannar på samma position */
.comment > .children .children {
    margin-left: 0 !important;
}


/*==============================================================================
    Stängda kommentarer
==============================================================================*/

.td-closed-comments {
    margin: 10px 0 0 !important;
    padding: 16px !important;

    background: #fff;
    border: 1px solid #e6e6e6;
    border-radius: 6px;

    font-family: "Fira Sans Condensed", sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.5;
    color: #666;

    text-align: center;
    box-sizing: border-box;
}

.td-closed-comments::before {
    content: "\1F4AD";
    margin-right: 6px;
}

.children .comment > article > .comment-content,
.children .comment > article > .comment-meta,
.children .comment > article > .comment-respond {
    margin-left: 92px !important;
}