/* hide discuss when loading */
.fs-discuss {
    display: none;
}

/* show discuss when ready (by adding 'ready' class in discuss.js init) */
.fs-discuss.ready {
    display: block;
}

.fs-discuss .postbox,
.fs-discuss .post {
    padding-top: 15px;
    padding-bottom: 15px;
}

.fs-discuss .reply-box .post {
    border-bottom: 1px solid #ccc;
    margin-bottom: 10px;
}

/* poster photo */
.fs-discuss .poster-photo {
    margin-right: 4px;
    border-radius: 50%;
    overflow: hidden;
}

/* post header */
.fs-discuss .header { 
    margin-bottom: 5px; 
}

.fs-discuss .header .comment-src {
    margin-bottom: 10px;
}
.fs-discuss .header .poster-name {
    color:#000; 
    font-weight: bold
}

.fs-discuss .header .info { 
    overflow: hidden; /* take rest space */
}
.fs-discuss .header .info .tools { 
    margin-left: 10px; 
}

.fs-discuss .post .body {
    overflow: auto;
}


/* postbox, editbox */
.fs-discuss .postbox form {
    overflow:hidden /* take rest space */
}

.fs-discuss .form-group[data-type="editor"] {
    /* remove margin between msg editor and form buttons */
    margin-bottom: 0px;
}

.fs-discuss .postbox .insertSeeker {
    
}

/* insert video seeker */
.fs-discuss .postbox .insertSeeker {
    float:left;
    padding-left:20px;
    cursor:pointer;
    background:url(/sys/res/icon/videopos.png) no-repeat 0 50%;
    color:#999;
    display: none;
}
.fs-discuss.support-videoSeek .postbox .insertSeeker {
    /* insert seek button, 只有在 support seek 的頁面出現 */
    display: initial;
}


/* postbox action buttons */
.fs-discuss .postbox .fs-form-buttons {
    margin-top: 5px;
}


/* show single thread */
.fs-discuss .single-thread-container {
    display:  none;
}
.fs-discuss.show-single-thread > *,
.fs-discuss.show-single-thread > .fs-tools.header-tools {
    /* hide all element in discuss block */
    display: none;
}
.fs-discuss.show-single-thread .single-thread-container {
    /* show single thread container only */
    display: block;
} 


.fs-discuss .title-icon {
    margin-left: 4px;
}

/* msg title */
.fs-discuss .msg-title {
    max-width: 100%;
}

/* quote box */
.fs-discuss .quotebox {
    position: relative; 
    padding: 5px; 
    border: 1px solid #ccc; 
    margin: 5px 0 5px 36px; 
    white-space: normal;
    overflow: hidden;
}

.fs-discuss .quoteShow{
    position: relative; 
    padding: 5px; 
    border: 1px solid #ccc; 
    margin: 5px 0 5px 0; 
    white-space: normal;
    overflow: hidden;
}

.fs-discuss .quotebox .qbody, .fs-discuss .quoteShow .qbody{
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding-left: 28px;
}

.fs-discuss .quotebox .qphoto, .fs-discuss .quoteShow .qphoto{
    display: inline;
}

.fs-discuss .quotebox .qphoto img, .fs-discuss .quoteShow .qphoto img{
    margin-right: 4px;
    border-radius: 50%;
    overflow: hidden;
    width:24px;
}


/* og box */
.fs-discuss .ogbox {
    position: relative; 
    padding: 5px; 
    border: 1px solid #ccc; 
    margin: 5px 0; 
    white-space: normal;
    overflow: hidden;
}
.fs-discuss .ogbox .thumb {
    float: left; 
    margin-right: 10px; 
    background: #fff;
    position: relative;
}

.fs-discuss .ogbox .thumb img {
    width: 200px;
    height: 100px; 
    padding: 1px; 
    border: 1px solid #999;
}
.fs-discuss .ogbox .thumb img:hover {
    border: 1px solid #000;
}

.fs-discuss .ogbox .cross {
    position:absolute; 
    top: 0; 
    right: 10px; 
    display: none; 
    cursor: pointer; 
    font-size: 20px; 
    color: #333;
}
.fs-discuss .ogbox:hover .cross {
    display: block;
}

.fs-discuss .ogbox .msg {
    overflow: hidden;
    display: block;
    margin-top: 10px;
}
.fs-discuss .ogbox .title {
    font-weight: bold; 
    font-size: 1.2em; 
    overflow: hidden; 
    text-overflow: ellipsis; 
    white-space: nowrap;
}
.fs-discuss .ogbox .url { 
    color :#888;
}
.fs-discuss .ogbox .note {
    font-size: 12px; 
    font-weight: normal; 
    color: #888; 
    overflow: hidden;
}

@media (max-width: 768px) {
    .fs-discuss .ogbox .thumb {
        width: 100%;
    }

    .fs-discuss .ogbox .thumb img {
        width: 100%;
    }

    .fs-discuss .ogbox .msg {
        display: inline-block;
    }

    .fs-discuss .ogbox .cross {
        position:absolute; 
        top: 0; 
        right: 10px; 
        display: block;
        cursor: pointer; 
        font-size: 20px; 
        color: #333;
        z-index: 1000;
    }
}
