/**
 * bbPress plugin CSS
 * jewelbeetle theme bbresss customized overwrite css
 */

#bbpress-forums,
#bbpress-forums #bbp-your-profile {          
    fieldset {
        label[for] {
            color: hsl(var(--jb--color-hsl-headline));
        }        
        input:not([type=button]),
        textarea,
        select {
            background-color: hsl(var(--jb--color-hsl-background-content));
            color: hsl(var(--jb--color-hsl-text-main));                
            border: 1px solid var(--jb--color-border);            
            &:focus {
              border: 1px solid currentColor;
              box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.1);
              outline-color: rgba(240, 255, 240, 0.1);
            }
        }
        div.bbp-the-content-wrapper input[type=button] {
            color: inherit;
        }
    }  
    .wp-editor-container {
        border: none;
    }
    .quicktags-toolbar {
        background: inherit;
        border: 1px solid var(--jb--color-border);
        border-bottom: none;
    }
}

#bbpress-forums {
    font-size: 1em;
    line-height: 1.5;
    h2 {
        font-size:1.7em;
    }
    h3 {
        font-size:1.4em;
    }    
    h4 {
        font-size:1.2em;
    }
    p {
        margin: .7em 0;
    }
    :is(div, ul) {
        &.odd {
            background-color: hsl(0 0% 80% / 5%);
        }
        &.even {
            background-color: hsl(0 0% 20% / 5%);
        }
    }    
    ul {      
        &.bbp-lead-topic,
        &.bbp-topics,
        &.bbp-forums,
        &.bbp-replies,
        &.bbp-search-results {
            font-size: 96%;
            border: 1px solid var(--jb--color-border);
        }
        &.status-publish {
            /* オープン */
            border-left: 4px solid rgb(107, 180, 250);
        }
        &.status-closed {
            /* クローズ */
            border-left: 4px solid #bbb;
            color: hsl(var(--jb--color-hsl-text-main) / .7);
            & a {
                color: hsl(var(--jb--color-hsl-text-main) / .7);
            }
        }
        &.status-private {
            /* プライベート（非公開）*/
            background-color: rgba(220, 112, 112, 0.1) !important;
            border-left: 4px solid rgba(220, 112, 112, 0.7);
        }
        &.sticky {
            /* 上位固定 */
            border-left: 4px solid #f7b977 !important;
        }
        &.super-sticky {
            /* 最上位固定 */
            background-color: rgba(247, 185, 119, 0.1) !important;
            border-left: 4px solid #ed6d35 !important;
        }        
    }
    li {
        &.bbp-header, 
        &.bbp-footer {
            font-weight: normal;
            background-color: hsl(var(--jb--color-hsl-theme-main));
            color: hsl(var(--jb--color-hsl-text-header));
            border: none;
        }
        &.bbp-body {
            ul {
                &.forum,
                &.topic {
                  border-top: 1px solid color-mix(in srgb, currentColor 10%, transparent);
                }                  
            }          
        }

        &.bbp-forum-topic-count, 
        &.bbp-topic-voice-count, 
        &.bbp-forum-reply-count, 
        &.bbp-topic-reply-count {
            font-size: 14px;
        }
        &.bbp-forum-freshness,
        &.bbp-topic-freshness {
            > a{
                font-size: 14px;
            }
        }          
    }

    div {
        &.bbp-forum-header, 
        &.bbp-topic-header, 
        &.bbp-reply-header {
            background-color: hsl(var(--jb--color-hsl-theme-main));
            color: hsl(var(--jb--color-hsl-text-header));           
            border-top: 1px solid color-mix(in srgb, currentColor 25%, transparent);
            span.bbp-admin-links a,
            a.bbp-reply-permalink {
                color: hsl(var(--jb--color-hsl-text-header) / .8);
            }
        }
        &.bbp-the-content-wrapper textarea.bbp-the-content {
            font-size: 1em;
        }

        &.bbp-forum-author,
        &.bbp-topic-author,
        &.bbp-reply-author {
            width: 110px;
            img.avatar {
                max-width: 64px;
            }
            .bbp-author-name {
                margin: 12px 0 4px;        
            }
        }

        &.bbp-forum-content,
        &.bbp-topic-content,
        &.bbp-reply-content {
            margin-left: 112px;
            ul, 
            ol {
                margin: 16px 8px 16px 0;
                padding: 0 4px 4px 32px;        
            }
            h2 {
                padding: 8px 0 8px 20px;
            }
            h3 {
                padding: 0 0 4px 8px;
                display: inline-block;
            }
            h5.card-title {
                margin: 0 0 3px;
                line-height: 1.5;
                > a {
                    font-weight: 700;
                }
            }
        }

        .bbp-template-notice {
            p,
            li {
                font-size: 13px;                
            }
        }    
    }
    .bbp-forum-info .bbp-forum-content,
    p.bbp-topic-meta {
        font-size: 85%;
    }

    .bbp-topic-pagination a:hover,
    .bbp-pagination-links a:hover,
    .bbp-pagination-links span.current {
        color: contrast-color(#ccc);
    }
    
    #bbp-user-wrapper {
        font-size: 1em;
        h2.entry-title {
            font-size:1.7em;
            padding: 12px 16px;
            margin-bottom: 20px;
            &::before {
                margin-left: 0;
            }
        }
        div {
            &.bbp-forum-author,
            &.bbp-topic-author,
            &.bbp-reply-author {
                width: 0;
                display: none;
                .bbp-author-role {
                    display: none;
                }
            }
            &.bbp-forum-content,
            &.bbp-topic-content,
            &.bbp-reply-content {
                margin-left: 12px;
            }              
        }      
    }
  
    #bbp-your-profile {
        fieldset {
            padding: 0 20px;
            &.bbp-form {
                margin: 16px 0;
                button {
                    border: 2px solid #0071a1;
                    background: #eee;
                    color: #0071a1;
                    &:hover {
                        background: #fff;
                    }
                }
            }        
            &.password {
                margin: 0;
                padding: 10px 8px 0 8px;
            }
            &.submit {
                border: none !important;
            }              
            label[for] {
                width: 100%;
                padding: 5px 15px 5px 0;
                text-align: left;
            }
        }      
    }
    
    input#bbp_topic_title {
        width: 100%;
    }
    
    .bbp-author-ip {
        display: none;
    }

    p.bbp-topic-meta,
    ul.bbp-reply-revision-log,
    ul.bbp-topic-revision-log,
    div.bbp-template-notice,
    .widget_display_topics,
    .widget_display_replies {
        img.avatar {
            margin-bottom: 2px;
            border: none;
        }
    }
       
    #bbp-single-user-details {
        width: 21%;
        #bbp-user-avatar {
            width: 100%;
            img.avatar {
                height: auto;
                width: auto;
            }
        }    
        #bbp-user-navigation {
            font-size: 14px;
            li.current a {
                font-weight: 700;
                text-decoration: none;
                background: color-mix(in srgb, currentColor 15%, transparent);              
                opacity: unset;
            }            
        }    
    }
    #bbp-user-body {
        background: hsl(var(--jb--color-hsl-background-content));
        margin-left: 24%;
        div.bbp-search-form {
            float: none;
            margin: 1em 0;
            text-align: right;
            /* bbpress2.6 ユーザーのトピック、返信の検索がうまく行かないので無効化しておく */
            display:none;
        }    
    }

    .bbp-forums-list {
        width: 170%;
        li {
            display: block;
            font-size: 16px;
            margin: 12px 0;
        }
    }
    
    .sd-content ul li {
        margin: 0 5px 5px 0;
    }
    fieldset.bbp-form {
        border: none;
        legend {
            padding-top: 0px;
        }
        select,
        input[type="text"]{
            height: auto;
        }
    }
}

@media screen and (max-width: 480px) {
    #bbpress-forums {
        li {
            &.bbp-forum-topic-count, 
            &.bbp-topic-voice-count, 
            &.bbp-forum-reply-count, 
            &.bbp-topic-reply-count {
                font-size: 12px;
            }
            &.bbp-forum-freshness,
            &.bbp-topic-freshness {
                > a{
                    font-size: 11px;
                }
            }            
        }
        div {
            &.bbp-forum-author,
            &.bbp-topic-author,
            &.bbp-reply-author {
                .bbp-author-role {
                    font-size: 12px;
                    font-style: italic;
                }
            }
            &.bbp-forum-content,
            &.bbp-topic-content,
            &.bbp-reply-content {
                margin-left: 82px;
            }            
        }
        .bbp-body {
            div.bbp-reply-author {
                margin: -4px 8px 8px;
                min-height: 64px;
                padding-left: 64px;
                position: relative;
                text-align: left;
                width: 100%;
                img.avatar {
                    position: absolute;
                    top: 12px;
                    left: 0;
                    width: 48px;
                    height: auto;
                }
            }
        }
        #bbp-user-body {
            clear:left;
            margin-left: 0;
        } 
        #bbp-single-user-details {
            width: 100%; 
            margin: 0 0 20px;
        }
    }
	div.bbp-submit-wrapper {
		float: right;
	}
}

div.bbp-breadcrumb, 
div.bbp-topic-tags {
    font-size: 82%;
}
span.bbp-admin-links {
    color: hsl(var(--jb--color-hsl-text-header) / .8);    
    a {
        font-size: 72%;
    }
}
#bbp-search-form {
    margin-bottom: 16px;
}

#subscription-toggle {
    float: right;
}
 
.bbp-topic-form, 
.bbp-reply-form, 
.bbp-topic-tag-form {
    padding: 0px 8px 2px;
    background: hsl(var(--jb--color-hsl-background-content) / .9);
    border: 1px solid hsl(var(--jb--color-hsl-theme-main));
    border-radius: 4px;
}

.bbp-login-form {
    fieldset {
        border: none;
        margin: 0;
    }
    .bbp-submit-wrapper {
        p {
            margin: .7em 0;
        }
    }    
    label {
        width: 100%;
    }    
    input[type="text"],
    input[type="password"] {
        max-width: 80% !important;
    }    
    .bbp-username input[type="text"],
    .bbp-email input[type="text"],
    input[type="password"] {
        width: 80%;
    }
    .bbp-login-links {
        float: left;
        width: 124px;
        margin-top: 16px;
        a {
            clear: none;
            margin: 0;
            display: block;
        }        
    }
    .bbp-remember-me {
        /* checkbox */
        label {
            width: 90%;
        }    
    }
}    

.editor-styles-wrapper {
    .bbp-login-form {
        fieldset {
            border: 1px solid var(--jb--color-border);
            legend {
                display: block;
            }
        }
        .bbp-submit-wrapper {
            float: left;
            text-align: center;
            clear: none;
            button {
                margin-top: 16px;                
            }
        }
    }
}

.widget_display_topics,
.widget_display_replies {
    ul {
        line-height: 1.4;
        list-style: none;
        padding: 0 4px 4px 16px;
        li {
            margin-bottom : 12px;
            a.bbp-forum-title,
            a.bbp-reply-topic-title {
                &:hover,
                &:focus {
                    text-decoration: underline;
                }
            }
            .widget-author-wrap {
                margin-top: 4px;
            }
            > div,
            > time {
                font-size : 88%;
                margin-left : 8px;
            }
        }
    }
    .bbp-author-avatar img {
        margin: 0px 5px 3px 2px;
    }
}

.bbp_widget_login {
    .bbp-logged-in {
        margin: 10px;
        img.avatar {
            margin: 0 15px 10px 0;
        } 
    }
}

.widget_display_search {
    form {
        margin: 4px 8px 12px;
    }
}   

.widget_display_stats {
    dl {
        display: inline-block;
        margin: 4px 12px 8px;
    }
    dt {
        clear: both;        
        float: left;
    }
    dd {
        float: right;
        margin: 0 0 4px 32px;
    }    
}