:root :where(.wp-block-post-comments-form) {  
    margin-top: var(--wp--preset--spacing--14)!important;  
	padding: var(--wp--preset--spacing--10);
    border-radius: 8px;
    background-color: var(--wp--preset--color--light-gray);
    display: flex;
    flex-direction: column;
    gap: 12px;

    .comment-reply-title {
        margin: 0;
        font-family: var(--wp--preset--font-family--poppins);
        color: var(--wp--preset--color--black);
        font-size: var(--wp--preset--font-size--base);
        font-weight: 600;
        line-height: var(--wp--custom--line-height--138);
    }

    

    .logged-in-as, .comment-notes, .comment-form-cookies-consent {
        margin: 0px;
        font-size: var(--wp--preset--font-size--sm);
        line-height: var(--wp--custom--line-height--150);
        font-weight: 400;
    }

    .comment-form-cookies-consent {
        margin-bottom: 16px;
    }

    .comment-form-comment {
        margin-top: 16px;        
    }

    .comment-form-comment label {
        display: none !important;
    }

    .required-field-message {
        font-size: var(--wp--preset--font-size--sm);

    }

    textarea:focus,input:not([type=submit]):focus {
        outline-color:var(--wp--preset--color--primary);
    }    

    textarea,input:not([type=submit]) {
        border: 0px;
        border-radius: 8px;
    }     

    .form-submit {
        margin: 0 !important;
        padding: 0 !important;
    }

    .form-submit .wp-element-button {
        width: 100%;
        margin: 0 !important; /* this removes margin-bottom */
    }   
    
}

:root :where(.wp-block-comments) {
    
    .wp-block-comments-title {
        font-size: var(--wp--preset--font-size--xl);
        font-weight: 600;
        line-height: var(--wp--custom--line-height--150);
        font-family: var(--wp--preset--font-family--poppins);
        color: var(--wp--preset--color--black);
        margin-bottom: var(--wp--preset--spacing--5);
        margin-right: 0px !important;
        margin-left: 0px !important;
    }

    .wp-block-comment-template {
        display: flex;
        flex-direction: column;
        gap: 42px;
        margin-right: 0px !important;
        margin-left: 0px !important;
        
    }

    .wp-block-comment-template > li {
        border-bottom: 0.5px solid var(--wp--preset--color--gray) !important;
        padding-bottom: 14px;
        
    }

    
    .wp-block-comment-template .wp-block-columns {
        display: flex;
        align-items: center;
        gap: 15px;
    }

    /* Avatar column (left) */
    .wp-block-comment-template .wp-block-columns > .wp-block-column:first-child {
        flex: 0 0 60px !important; /* fixed width column */
        max-width: 60px !important;
    }

    /* Avatar image */
    .wp-block-comment-template .wp-block-avatar .avatar {
        width: 60px !important;
        height: 60px !important;
        border-radius: 100% !important;
        object-fit: cover;
    }

    /* Content column (right) */
    .wp-block-comment-template .wp-block-columns > .wp-block-column:last-child {
        flex: 1 1 auto;
        min-width: 0;

    }

    /* Optional spacing for nested replies */
    .wp-block-comment-template .children {
        margin-left: 60px;
        padding-left: 20px;
        border-left: 1px solid var(--wp--preset--color--light-gray);
    }

    .wp-block-comment-author-name {
        font-size: var(--wp--preset--font-size--sm) !important;
        font-weight: 600;
        line-height: var(--wp--custom--line-height--150);
        font-family: var(--wp--preset--font-family--poppins);
        color: var(--wp--preset--color--black);
        
    }

    .wp-block-comment-date {
        font-size: var(--wp--preset--font-size--xs) !important;
        font-family: var(--wp--preset--font-family--figtree);
        a{
            color: var(--wp--preset--color--gray-text); 
        }
    }

    .wp-block-comment-content p {
        font-size: var(--wp--preset--font-size--sm) !important;
        font-weight: 400;
        line-height: var(--wp--custom--line-height--150);
        font-family: var(--wp--preset--font-family--poppins);
        color: var(--wp--preset--color--gray-text);
        margin-top: 24px;
        margin-bottom: 24px;
    }

    .wp-block-comment-reply-link a {
        font-size: var(--wp--preset--font-size--sm) !important;
        color: var(--wp--preset--color--gray-text);
        text-decoration: none;
    }

    .wp-block-comment-reply-link a:hover {
        color: var(--wp--preset--color--black);
        text-decoration: underline;
    }

}
   
@media (max-width: 425px) {
  :root :where(.wp-block-post-comments-form) {
    padding: 20px !important;
  }
}