/* 1.18.8: one comment area for every designed article (reviews, lists, guides, Reader's Corner, Author's Corner).
   The theme's comments.php markup stays; this only restyles it. !important where the theme's own rules are more specific. */
body.bebd-chrome section.comments{--cm-ink:#1c1b2e;--cm-soft:#3d3f52;--cm-mute:#6f6c7c;--cm-line:#ebe4d8;--cm-c:#7a2e5a;--cm-c2:#b4547f;--cm-s:#f7e8f0;--cm-serif:'Fraunces',Georgia,serif;--cm-read:'Newsreader',Georgia,serif;--cm-ui:'Inter',system-ui,sans-serif}
body.bebd-chrome section.comments .cbox{background:#fff!important;border:1px solid var(--cm-line)!important;border-radius:28px!important;padding:44px clamp(20px,4vw,52px)!important;box-shadow:0 30px 60px -44px rgba(28,27,46,.35)!important;font-family:var(--cm-ui)!important;color:var(--cm-ink)!important}

/* headings: "1 COMMENT" / "LEAVE A REPLY" in sentence case */
body.bebd-chrome section.comments .td-comments-title-wrap{margin:0 0 26px!important;padding:0!important;border:0!important;background:none!important}
body.bebd-chrome section.comments .td-comments-title,body.bebd-chrome section.comments .comment-reply-title{display:block!important;margin:0 0 6px!important;padding:0!important;border:0!important;background:none!important;font:400 30px/1.15 var(--cm-serif)!important;letter-spacing:-.02em!important;color:var(--cm-ink)!important;text-transform:lowercase!important;text-align:left!important}
body.bebd-chrome section.comments .td-comments-title span{display:inline-block!important;background:none!important;padding:0!important;color:inherit!important;font:inherit!important}
body.bebd-chrome section.comments .td-comments-title:first-letter,body.bebd-chrome section.comments .td-comments-title span:first-letter,body.bebd-chrome section.comments .comment-reply-title:first-letter{text-transform:uppercase}
body.bebd-chrome section.comments .td-comments-title:before,body.bebd-chrome section.comments .td-comments-title:after,body.bebd-chrome section.comments .td-comments-title span:before,body.bebd-chrome section.comments .td-comments-title span:after{display:none!important}
body.bebd-chrome section.comments .comment-reply-title small a{margin-left:10px;font:500 13px var(--cm-ui)!important;text-transform:none!important;color:var(--cm-c)!important}

/* the comments */
body.bebd-chrome section.comments .comment-list{list-style:none!important;margin:0 0 44px!important;padding:0!important}
body.bebd-chrome section.comments .comment-list li{list-style:none!important;margin:0!important;padding:0!important;border:0!important}
body.bebd-chrome section.comments .comment-list .children{list-style:none!important;margin:0 0 0 28px!important;padding:0 0 0 22px!important;border-left:2px solid var(--cm-s)!important}
body.bebd-chrome section.comments .comment-list article{position:relative;padding:24px 0!important;margin:0!important;border:0!important;border-bottom:1px solid var(--cm-line)!important}
body.bebd-chrome section.comments .comment-list footer{display:flex!important;align-items:center;gap:12px;margin:0 0 12px!important;padding:0!important}
body.bebd-chrome section.comments .comment-list .avatar{width:44px!important;height:44px!important;border-radius:50%!important;margin:0!important;float:none!important;box-shadow:0 0 0 3px #fff,0 0 0 4px var(--cm-line)}
body.bebd-chrome section.comments .comment-list cite{font:600 15px var(--cm-ui)!important;font-style:normal!important;color:var(--cm-ink)!important;text-transform:none!important}
body.bebd-chrome section.comments .comment-list .comment-link,body.bebd-chrome section.comments .comment-list time{font:400 13px var(--cm-ui)!important;color:var(--cm-mute)!important;text-transform:none!important;margin-left:auto}
body.bebd-chrome section.comments .comment-content,body.bebd-chrome section.comments .comment-content p{font:400 17px/1.7 var(--cm-read)!important;color:var(--cm-soft)!important;margin:0 0 12px!important}
body.bebd-chrome section.comments .comment-meta{margin:6px 0 0!important;padding:0!important;border:0!important}
body.bebd-chrome section.comments .comment-reply-link{display:inline-flex!important;align-items:center;padding:7px 16px!important;border-radius:999px!important;border:1px solid var(--cm-line)!important;background:#fff!important;font:600 13px var(--cm-ui)!important;color:var(--cm-c)!important;text-transform:none!important;letter-spacing:0!important;transition:all .2s}
body.bebd-chrome section.comments .comment-reply-link:hover{background:var(--cm-c)!important;border-color:var(--cm-c)!important;color:#fff!important}
body.bebd-chrome section.comments .comment-pagination{margin:0 0 30px}

/* the form */
body.bebd-chrome section.comments .comment-respond{margin:0!important;padding:0!important}
body.bebd-chrome section.comments .logged-in-as,body.bebd-chrome section.comments .comment-notes{font:400 14px var(--cm-ui)!important;color:var(--cm-mute)!important;margin:0 0 18px!important}
body.bebd-chrome section.comments .logged-in-as a,body.bebd-chrome section.comments .comment-notes a{color:var(--cm-c)!important;font-weight:600!important;text-decoration:none!important}
body.bebd-chrome section.comments #commentform{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px 16px;margin:0!important}
body.bebd-chrome section.comments #commentform > *{grid-column:1/-1;margin:0!important}
body.bebd-chrome section.comments #commentform > .td-form-author,body.bebd-chrome section.comments #commentform > .td-form-email,body.bebd-chrome section.comments #commentform > .td-form-url{grid-column:auto}
body.bebd-chrome section.comments #commentform .clearfix{display:none!important}
body.bebd-chrome section.comments .comment-form-input-wrap{margin:0!important;padding:0!important;width:auto!important;float:none!important}
body.bebd-chrome section.comments #commentform textarea,body.bebd-chrome section.comments #commentform input[type=text],body.bebd-chrome section.comments #commentform input[type=email],body.bebd-chrome section.comments #commentform input[type=url]{display:block!important;width:100%!important;max-width:none!important;min-height:52px;margin:0!important;padding:14px 16px!important;border:1px solid var(--cm-line)!important;border-radius:16px!important;background:#fcfbf8!important;font:400 16px/1.5 var(--cm-ui)!important;color:var(--cm-ink)!important;box-shadow:none!important;transition:border-color .2s,box-shadow .2s,background .2s}
body.bebd-chrome section.comments #commentform textarea{min-height:150px;resize:vertical}
body.bebd-chrome section.comments #commentform textarea::placeholder,body.bebd-chrome section.comments #commentform input::placeholder{color:#9a96a6!important;opacity:1}
body.bebd-chrome section.comments #commentform textarea:focus,body.bebd-chrome section.comments #commentform input[type=text]:focus{outline:0!important;border-color:var(--cm-c)!important;background:#fff!important;box-shadow:0 0 0 4px rgba(122,46,90,.12)!important}

/* every checkbox row the same: cookies, newsletter, Jetpack notify */
body.bebd-chrome section.comments .comment-form-cookies-consent,body.bebd-chrome section.comments .mc4wp-checkbox,body.bebd-chrome section.comments .comment-subscription-form{display:block!important;margin:0!important;padding:0!important;font:400 14.5px/1.5 var(--cm-ui)!important;color:var(--cm-soft)!important}
body.bebd-chrome section.comments .comment-form-cookies-consent,body.bebd-chrome section.comments .mc4wp-checkbox label,body.bebd-chrome section.comments .comment-subscription-form{display:flex!important;align-items:flex-start;gap:10px}
body.bebd-chrome section.comments .comment-form-cookies-consent label,body.bebd-chrome section.comments .mc4wp-checkbox span,body.bebd-chrome section.comments .subscribe-label{display:inline!important;margin:0!important;padding:0!important;font:400 14.5px/1.5 var(--cm-ui)!important;color:var(--cm-soft)!important;text-transform:none!important;cursor:pointer}
body.bebd-chrome section.comments #commentform input[type=checkbox]{flex:none;width:18px!important;height:18px!important;margin:2px 0 0!important;accent-color:var(--cm-c);cursor:pointer}

/* submit */
body.bebd-chrome section.comments .form-submit{margin:10px 0 0!important}
body.bebd-chrome section.comments #commentform #submit,body.bebd-chrome section.comments #commentform .submit{display:inline-flex!important;align-items:center;height:auto!important;padding:15px 30px!important;border:0!important;border-radius:999px!important;background:linear-gradient(135deg,var(--cm-c),var(--cm-c2))!important;color:#fff!important;font:600 15px var(--cm-ui)!important;letter-spacing:0!important;text-transform:none!important;cursor:pointer;box-shadow:0 14px 28px -14px rgba(122,46,90,.7)!important;transition:transform .2s,box-shadow .2s}
body.bebd-chrome section.comments #commentform #submit:hover{transform:translateY(-1px);box-shadow:0 18px 32px -14px rgba(122,46,90,.8)!important}

@media(max-width:700px){
  body.bebd-chrome section.comments .cbox{border-radius:22px!important;padding:28px 18px!important}
  body.bebd-chrome section.comments #commentform{grid-template-columns:minmax(0,1fr)}
  body.bebd-chrome section.comments .td-comments-title,body.bebd-chrome section.comments .comment-reply-title{font-size:25px!important}
  body.bebd-chrome section.comments .comment-list .children{margin-left:8px!important;padding-left:14px!important}
  body.bebd-chrome section.comments #commentform #submit{width:100%;justify-content:center}
}

/* the review/guide stylesheets style this heading too; the #comments id outranks them */
body.bebd-chrome section.comments #comments .td-comments-title,body.bebd-chrome section.comments #comments .td-comments-title span{font:400 30px/1.15 var(--cm-serif)!important;letter-spacing:-.02em!important;text-transform:lowercase!important;border:0!important;padding:0!important;margin:0!important;color:var(--cm-ink)!important;background:none!important}
body.bebd-chrome section.comments #comments .td-comments-title span:first-letter{text-transform:uppercase!important}
body.bebd-chrome section.comments #commentform .mc4wp-checkbox label{display:flex!important;align-items:flex-start;gap:10px}
@media(max-width:700px){body.bebd-chrome section.comments #comments .td-comments-title,body.bebd-chrome section.comments #comments .td-comments-title span{font-size:25px!important}}
