/* ==========================================================
   Captain Widgets Kit – Post Comments Widget
   File: assets/css/widgets/post-comments/captwiki-post-comments.css
   Loads: only when captwiki-post-comments widget is active
   ========================================================== */

/* ──────────────────────────────────────────────────────────
   WRAPPER
   ────────────────────────────────────────────────────────── */
.cw-post-comments {
	width: 100%;
}

.cw-post-comments .comments-area {
	width: 100%;
}

/* ──────────────────────────────────────────────────────────
   COMMENT COUNT HEADING
   ────────────────────────────────────────────────────────── */
.cw-post-comments .cw-comment-section-title {
	font-size:     20px;
	font-weight:   700;
	margin-bottom: 20px;
	line-height:   1.3;
}

/* ──────────────────────────────────────────────────────────
   COMMENT LIST
   ────────────────────────────────────────────────────────── */
.cw-post-comments .comment-list {
	list-style: none;
	margin:     0;
	padding:    0;
}

.cw-post-comments .comment-list li {
	list-style: none;
}

.cw-post-comments .comment-list > .comment:not(.parent),
.cw-post-comments .comment-list ul.children li,
.cw-post-comments .comment-list > .comment.parent > .comment-body {
	padding:       20px;
	margin-bottom: 16px;
	position:      relative;
	transition:    box-shadow 0.2s ease, border-color 0.2s ease;
}

.cw-post-comments .comment-list ul.children {
	list-style: none;
	margin:     12px 0 0 40px;
	padding:    0;
}

/* Avatar */
.cw-post-comments .comment-list li.comment > .comment-body img.avatar,
.cw-post-comments .comment-list li.pingback > .comment-body img.avatar {
	width:         60px;
	height:        60px;
	border-radius: 50%;
	float:         left;
	margin-right:  16px;
	transition:    box-shadow 0.2s ease, border-color 0.2s ease;
	object-fit:    cover;
}

/* Comment body clearfix */
.cw-post-comments .comment-body {
	overflow: hidden;
}

/* Username */
.cw-post-comments .comment-author.vcard .fn,
.cw-post-comments .comment-author.vcard .fn .url {
	font-weight:     600;
	font-size:       15px;
	text-decoration: none;
	transition:      color 0.2s ease;
}

/* Meta (date/edit) */
.cw-post-comments .comment-meta .comment-metadata a {
	font-size:       13px;
	text-decoration: none;
	transition:      color 0.2s ease;
}

.cw-post-comments .comment-meta .comment-metadata {
	margin-top: 2px;
}

/* Comment content */
.cw-post-comments .comment-list .comment-content,
.cw-post-comments .comment-list .comment-content p {
	font-size:   15px;
	line-height: 1.6;
	margin-top:  10px;
	transition:  color 0.2s ease;
}

/* Reply link */
.cw-post-comments .comment-list .reply {
	margin-top: 10px;
}

.cw-post-comments .comment-list .reply a {
	display:         inline-block;
	font-size:       13px;
	font-weight:     600;
	padding:         5px 14px;
	border-radius:   4px;
	text-decoration: none;
	transition:      color 0.2s ease, background 0.2s ease, border-color 0.2s ease;
}

/* ──────────────────────────────────────────────────────────
   COMMENT FORM
   ────────────────────────────────────────────────────────── */
.cw-post-comments #respond.comment-respond {
	margin-top: 32px;
}

/* Reply title */
.cw-post-comments #respond.comment-respond h3#reply-title {
	font-size:     22px;
	font-weight:   700;
	margin-bottom: 20px;
	line-height:   1.3;
	display:       flex;
	align-items:   center;
	gap:           12px;
}

/* Cancel reply */
.cw-post-comments #respond.comment-respond #cancel-comment-reply-link {
	font-size:       13px;
	font-weight:     500;
	text-decoration: none;
	margin-left:     12px;
	transition:      color 0.2s ease;
}

/* Form labels */
.cw-post-comments #respond #commentform label {
	display:       block;
	font-size:     14px;
	font-weight:   600;
	margin-bottom: 6px;
}

/* Text / textarea fields */
.cw-post-comments #commentform #author,
.cw-post-comments #commentform #email,
.cw-post-comments #commentform #url,
.cw-post-comments form.comment-form textarea#comment {
	width:         100%;
	padding:       10px 14px;
	font-size:     14px;
	line-height:   1.5;
	border:        1px solid #d1d5db;
	border-radius: 6px;
	background:    #ffffff;
	color:         #1f2937;
	transition:    border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
	box-sizing:    border-box;
	outline:       none;
}

.cw-post-comments #commentform #author:focus,
.cw-post-comments #commentform #email:focus,
.cw-post-comments #commentform #url:focus,
.cw-post-comments form.comment-form textarea#comment:focus {
	border-color: #2563eb;
	box-shadow:   0 0 0 3px rgba(37, 99, 235, 0.12);
}

/* Comment textarea row */
.cw-post-comments form.comment-form .cw-comment-row {
	margin-bottom: 16px;
}

/* Field rows (author, email, url) */
.cw-post-comments .comment-form-author,
.cw-post-comments .comment-form-email,
.cw-post-comments .comment-form-url,
.cw-post-comments .comment-form-cookies-consent {
	margin-bottom: 16px;
}

/* Logged in as */
.cw-post-comments #comments .logged-in-as {
	font-size:    13px;
	margin-bottom: 12px;
}

.cw-post-comments #comments .logged-in-as a {
	text-decoration: none;
}

/* Must log in */
.cw-post-comments #comments .must-log-in {
	font-size: 14px;
}

/* Submit button */
.cw-post-comments #commentform #submit {
	display:       inline-block;
	padding:       12px 28px;
	font-size:     15px;
	font-weight:   600;
	line-height:   1.4;
	border:        2px solid transparent;
	border-radius: 6px;
	cursor:        pointer;
	transition:    background 0.25s ease, color 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
	background:    #2563eb;
	color:         #ffffff;
}

.cw-post-comments #commentform #submit:hover {
	background: #1d4ed8;
}

.cw-post-comments #commentform #submit:focus-visible {
	outline:        3px solid #2563eb;
	outline-offset: 3px;
}

.cw-post-comments #comments .form-submit {
	margin-top: 8px;
}

/* ──────────────────────────────────────────────────────────
   EDITOR PLACEHOLDER
   ────────────────────────────────────────────────────────── */
.cw-post-comments.cw-editor-placeholder {
	border:        2px dashed #d1d5db;
	border-radius: 8px;
	min-height:    120px;
	display:       flex;
	align-items:   center;
	justify-content: center;
}

/* ──────────────────────────────────────────────────────────
   DARK MODE
   ────────────────────────────────────────────────────────── */
body.dark-mode .cw-post-comments #commentform #author,
body.dark-mode .cw-post-comments #commentform #email,
body.dark-mode .cw-post-comments #commentform #url,
body.dark-mode .cw-post-comments form.comment-form textarea#comment {
	background:   #1e293b;
	color:        #f1f5f9;
	border-color: #334155;
}

body.dark-mode .cw-post-comments #commentform #author:focus,
body.dark-mode .cw-post-comments #commentform #email:focus,
body.dark-mode .cw-post-comments #commentform #url:focus,
body.dark-mode .cw-post-comments form.comment-form textarea#comment:focus {
	border-color: #60a5fa;
	box-shadow:   0 0 0 3px rgba(96, 165, 250, 0.15);
}

body.dark-mode .cw-post-comments .cw-comment-section-title,
body.dark-mode .cw-post-comments #respond.comment-respond h3#reply-title {
	color: #f1f5f9;
}

/* ──────────────────────────────────────────────────────────
   RESPONSIVE
   ────────────────────────────────────────────────────────── */
@media (max-width: 767px) {
	.cw-post-comments .comment-list ul.children {
		margin-left: 20px;
	}

	.cw-post-comments .comment-list li.comment > .comment-body img.avatar {
		width:  44px;
		height: 44px;
	}

	.cw-post-comments .comment-form-author,
	.cw-post-comments .comment-form-email,
	.cw-post-comments .comment-form-url {
		width: 100% !important;
		float: none !important;
	}
}