/* --- Favorites --- */
/* History | similar */
/*       START       */
.b-user.detailed{
    background: #FFF;
    position: relative;
    margin-bottom: 10px;
    border: 1px solid #dcdcdc;
	padding: 10px;
    display: flex;
    gap: 10px;
    border-radius: 5px;
}

.b-user.detailed .info{
    position: relative;
    padding: 10px;
	display: inline-block;

}

.b-user.detailed .info:nth-child(2n+1) {
    clear: left;
}

.b-user.detailed .info .image-name:after { 
    clear: both;
    content: "";
    display: block;
    height: 0;
    width: 0;
    visibility: hidden;
}

.b-user.detailed .info .image-name .name {
    font-size: 14px;
    font-weight: 500;
    line-height: 17px;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
}

.b-user.detailed .info .image-name .image {
    height: 73px;
    width: 73px;
}

.b-user.detailed .info .last-online{
    font-size: 11px;
    line-height: 1.3;
    margin-top: 1px;
}

.history.sidebar {
    padding: 10px 30px;
    flex-direction: column;
}

.history.sidebar .line {
    flex: 1 1 100%;
}


.history {
	position: relative;
    width: 100%;
    border-left: 1px solid #dcdcdc;
    display: flex;
    gap: 5px;
    flex-direction: row;
    box-sizing: border-box;
    padding-left: 5px;
    flex-wrap: wrap;
}


.history .line {
    font-size: 12px;
    padding: 8px;
    display: flex;
    justify-content: flex-end;
    border-radius: 5px;  
    gap: 10px;
    flex: 1 1 49%;
    height: fit-content;
    border: 1px solid #dcdcdc;
    text-decoration: none;
    font-weight: 500;
    -webkit-transition: color .14s ease-in-out, border-color .14s ease-in-out;
            transition: color .14s ease-in-out, border-color .14s ease-in-out;
    box-sizing: border-box;
}

.history .line:hover {
    color: #2fa700;
    border-color: #2fa700;
}

.history .line_bg {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 5px;
    border-radius: 3px;
    height: fit-content;
    align-items: flex-end;
    height: fit-content;   
}

.history .line_bg > span {
    display: flex;
    gap: 10px;   
}

.history .line .h_type,
.history .line .h_date {
   color: #acb1b4;
    font-weight: normal;
    font-size: 11px;
    float: right;
}

.history .line .h_title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #176093;
    cursor: pointer;
    display: block;
}

#sidebar-fav-list-marker,
#sidebar-fav-list-legend,
#sidebar-fav-list {
    list-style-type: none;
    padding: 10px;
    margin: 0;
    background: #cccccc2e;
    border-radius: 5px;
    border: 1px solid #cccccc61;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.sidebar-fav-list-title {
    background: #cccccc2e;
    border-radius: 5px 5px 0 0;
    padding: 5px;
    border: 1px solid #cccccc61;
    border-bottom-width: 0;
    font-size: 12px;
    font-weight: 700;
    color: #999;
}

/* v2 */
#sidebar-fav-list-legend {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}    

#sidebar-fav-list-legend .line .bar-marker {
    width: 20px;
    height: 20px;
}

#sidebar-fav-list-legend .line {
    display: inline-flex;
    gap: 5px;
    flex: 1 1 calc(50% - 5px);
}

#sidebar-fav-list-legend .line_type_1 .bar-marker {
    background-color: #4682b4;
}

#sidebar-fav-list-legend .line_type_2 .bar-marker {
    background-color: #bd6288;
}

#sidebar-fav-list-legend .line_type_3 .bar-marker {
    background-color: #c9cf79;
}

#sidebar-fav-list-legend .line_type_4 .bar-marker {
    background-color: #7662bd;
}

#sidebar-fav-list-legend .line_type_5 .bar-marker {
    background-color: #79cfa4;
}

#sidebar-fav-list-legend .line_type_6 .bar-marker {
    background-color: #025192;
}

#sidebar-fav-list-marker .line {
    height: 16px;
    border-radius: 3px;
    -webkit-transition: background-color .2s ease-in-out;
            transition: background-color .2s ease-in-out;
}

#sidebar-fav-list-marker {
    display: flex;
    flex-direction: row;
}

#sidebar-fav-list-marker .line_type_1 {
    background-color: #4682b4;
}

#sidebar-fav-list-marker .line_type_2 {
    background-color: #bd6288;
}

#sidebar-fav-list-marker .line_type_3 {
    background-color: #c9cf79;
}

#sidebar-fav-list-marker .line_type_4 {
    background-color: #7662bd;
}

#sidebar-fav-list-marker .line_type_5 {
    background-color: #79cfa4;
}

#sidebar-fav-list-marker .line_type_6  {
    background-color: #025192;
}

/* v1 */
#sidebar-fav-list .articles-list-plain {
    -webkit-box-sizing: initial;
    box-sizing: initial;
}

#sidebar-fav-list .line {
    clear: right;
    padding: 0 5px 0 2px;
    margin-bottom: 1px;
}

#sidebar-fav-list .x_label {
    font-weight: normal;
    font-size: 11px;
}

#sidebar-fav-list .line .x_label {
    color: #444;
    font-size: 12px;
    font-weight: bold;
    float: right;
    line-height: 16px;
}

#sidebar-fav-list .bar-container {
    margin-right: 120px;
}

#sidebar-fav-list .line .bar-container .bar.min {
    min-width: 1px;
}

#sidebar-fav-list .line .bar-container .bar {
    height: 16px;
    border-radius: 3px;
    -webkit-transition: background-color .2s ease-in-out;
            transition: background-color .2s ease-in-out;
}

#sidebar-fav-list .line .bar-container .bar div {
    line-height: 16px;
    padding: 0 3px;
}

#sidebar-fav-list .bar.s0 {
    background-color: #4682b4;
}

#sidebar-fav-list .bar.s1 {
    background-color: #6295bd;
}

#sidebar-fav-list .bar.s2 {
    background-color: #79a9cf;
}

#sidebar-fav-list .bar.s3 {
    background: #98c2e3;
}

#sidebar-fav-list .active .bar.s3 {
    background: #4c87b5;
}

#sidebar-fav-list .bar:hover.s0 {
    background: #6295bd;
}

#sidebar-fav-list .bar:hover.s1 {
    background: #79a9cf;
}

#sidebar-fav-list .bar:hover.s2 {
    background: #98c2e3;
}

#sidebar-fav-list .bar:hover.s3 {
    background: #b3d7f2;
}

/* --- Favorites / addlist contain --- */
.addlist {
	z-index: 105;
	display:inline-block;
	vertical-align:bottom;
	text-align: initial;
	--l-height: 28px;
    user-select: none;
    position: relative;
}

.addlist.active {
    z-index: 120;
}

/* .addlist div[data-owner="main"],
.addlist div[data-owner="showfull"] {
    display: flex;
    gap: 5px;
} */

.addlist .trigger, 
.addlist .option {
    border: 1px solid #bce6ff;
    background: #daf1ff;
    border-color: #bce6ff;
    color: #176093;	
    border-left-width: 5px;
    font-size: 14px;
    font-weight: bold;
    line-height: var(--l-height);
    max-width: 230px;
    min-width: 190px;
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    display: inline-flex;
	justify-content: space-between;
	position: relative;
    box-sizing: border-box;
    gap: 5px;
    padding-left: 5px;
    vertical-align: top;
}

.addlist .fav-user-list > div {
    display: flex;
    align-items: center;
}

.addlist .fav-user-list .list_menu {
    display: flex;
    align-items: center;
    opacity: 0;
}

.fav-user-list [data-status]:hover .list_menu {
    z-index: 2;
    opacity: 1;
}

.fav-user-list [data-status] .list_menu {
	right: 1px;
	position: absolute;
	-webkit-transition: all .3s ease-in-out;
	        transition: all .3s ease-in-out;
}

.addlist .option {
	display: flex;
    justify-content: flex-start;
	align-items: center;
}

.addlist .u-option {    
	display: flex;
    align-items: center;
	justify-content: flex-start;
	z-index: 2;
}

.addlist .favorites-list-delete:hover,
.addlist .favorites-list-edit:hover {
    /* background: #EBEEF1; */
    /* border-color: #DBE0E6; */
    color: #7b8084;
}

.addlist .favorites-list-delete:hover,
.addlist .favorites-list-edit:hover,
.addlist .u-option:hover {
	cursor: pointer;
}

.addlist .favorites-list-delete,
.addlist .favorites-list-edit {
	text-align: center;
    z-index: 1;
    line-height: 26px;
}

.addlist .favorites-addlist,
.addlist .favorites-addnote {
    background-color: #daf1ff;
    border: 1px solid #bce6ff;
}

.addlist .favorites-list-delete,
.addlist .favorites-list-edit,
.addlist .favorites-addlist,
.addlist .favorites-addnote {
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    position: relative;
    display: inline-flex;
    align-items: center;
	color: #176093;
	box-sizing: border-box;
    padding: 0 6px;
    height: calc(var(--l-height) + 2px);
}

.favorites-addlist:hover,
.favorites-addnote:hover {
    background: #EBEEF1;
    border-color: #DBE0E6;
    color: #7b8084;
	cursor: pointer;	
}

.favorites-addlist .fav-icon,
.favorites-addnote .fav-icon {
	display: inline-block;
    width: 16px;
    height: 16px;
    fill: currentcolor;
    vertical-align: text-top;
    position: relative;	
}

.addlist[data-class="on_hold"] .option:hover{
	border-left-color: #737373;
}

.addlist[data-class="on_hold"] .trigger,
.addlist[data-class="on_hold"] .option {
    background: #EBEEF1;
    border-color: #DBE0E6;
    color: #7b8084;
}

.addlist[data-class="dropped"] .trigger,
.addlist[data-class="dropped"] .option {
    background: #FEDDDF;
    border-color: #FEC2C5;
    color: #FC575E;
}

.addlist input[type="checkbox"] {
	opacity: 0;
    visibility: hidden;
    display: none;
}

.addlist input[type="checkbox"]:checked + .option {
    background: #93ffe6;
    border-color: #1c876f;
    color: #1c876f;
}

/* .addlist input[type="checkbox"]:checked + .option .status-name {
    text-shadow: 0px 0px 3px #03FF13, 0px 3px 0px #005f06, 0px -3px 0px #005f06;
    color: #adff2f;
} */

.addlist .option:hover {
	color: #737373;
	border-left-color:#737373;
    cursor: pointer;
}

.addlist .trigger:hover {
    border-color: #bcc1c7;
}

.addlist .option .text {
	transform: translate3d(0, 0, 0);
    -webkit-transition: transform .3s ease;
    transition: transform .3s ease;
}

.addlist .option:hover .text {
	transform: translate3d(5px, 0, 0);
}

/* .addlist .option .fav-icon {
	opacity: 0;
} */

/* .addlist .option:hover .fav-icon {
	opacity: 1;
} */

/* .addlist .add-trigger .edit,
.addlist .trigger .edit {
	padding: 0 5px;
} */

/* .addlist .trigger .text:first-child{
    padding-left: 5px;
} */

.addlist .trigger .text,
.addlist .option .text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-decoration: none;
    cursor: pointer;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 1px;    
}

.addlist .trigger .note {
	position: absolute;
    top: 0;
	display: none;
}

.addlist .expanded-options .remove-trigger {
    color: #FF4136;
}

.addlist .expanded-options {
	position: absolute;
    display: none;
	z-index: 100;
    -webkit-transition: all .3s ease;
            transition: all .3s ease;
}

.addlist .edit-trigger {
	display: inline-flex;
    gap: 5px;
}

.addlist .trigger-arrow {
    cursor: pointer;
    color: #9da2a8;
    display: flex;
    align-items: center;
    padding: 0 10px;
    position: relative;
}

.addlist .trigger-arrow .arrow-icon {
    opacity: 1;
    transform: scale(1);
    -webkit-transition: transform .3s ease-in-out, opacity .3s ease-in-out;
            transition: transform .3s ease-in-out, opacity .3s ease-in-out;
}

.addlist .trigger-arrow > div:nth-child(2) {
    display: flex;
    z-index: 2;
}

.addlist .trigger-arrow .fav-icon {
	height: 12px;
    width: 12px;
}

.addlist .edit-trigger .edit,
.addlist .add-trigger .edit {
    display: flex;
    align-items: center;
}

.addlist .fav-icon {
	height: 16px;
    width: 16px;
	fill: currentcolor;
}

.addlist .trigger-arrow.show .fav-icon {
	transform: rotate(90deg);
}


#fav-note {
	background: #FFF;
	padding: 25px;
	width: 500px;
	margin: 0 auto;
	position: relative;
}

#fav-note .fav-note-text {
	width:99%;
	height:80px;
	min-height:80px;
	resize:none;
}

#fav-note .note-foot {
	margin-top:10px;
}

#fav-create-list {
	background: #FFF;
	padding: 25px;
	width: 500px;
	margin: 0 auto;
	position: relative;
}

#fav-create-list > div {
    display: flex;
    flex-direction: column;
    align-items: center;
}

#fav-create-list .fav-list-name {
	width:100%;
	padding: 5px;
}

#fav-create-list .foot {
	margin-top:10px;
}

/*---Loading indicator---*/
.addlist.preloaded .css-animation { opacity: 1; }
.addlist.preloaded .arrow-icon {
    opacity: 0;
    transform: scale(.7);
}

.trigger-arrow .animation-wrap { 
    position: absolute;
    width: 35px;
    height: var(--l-height);
    top: 50%;
    left: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
            transform: translateX(-50%) translateY(-50%);
    z-index: 1;
}

.trigger-arrow .css-animation { 
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    border-radius: 50px;
    bottom: 0;
}

.trigger-arrow .css-animation { 
    height: 20px;
    width: 20px;
    -webkit-animation: rotation .6s infinite linear;
    animation: rotation .6s infinite linear;
    border-left: 3px solid rgb(0 0 0 / 10%);
    border-right: 3px solid rgb(0 0 0 / 10%);
    border-bottom: 3px solid rgb(0 0 0 / 10%);
    border-top: 3px solid rgb(120 120 120 / 80%);
    padding: 0;
    transition:all .5s ease-in-out;
    opacity: 0; 
    visibility: visible;
}

@-webkit-keyframes rotation{from{transform:rotate(0)}to{transform:rotate(359deg)}}
@keyframes rotation{from{transform:rotate(0)}to{transform:rotate(359deg)}}
/* --- Favorites / Profile contain --- */
.c-lists-info{
	border-bottom: 1px solid #abacad;
    margin-bottom: 10px;
    padding-bottom: 5px;
}	

.c-lists-info .b-stats_bar .compatibility a, .c-info .c-lists-info .b-stats_bar .compatibility span.link-replacement {
    float: right;
    font-size: 11px;
    margin-top: 2px;
}

.b-stats_bar {
    line-height: 16px;
    min-height: 50px;
}
	
.b-stats_bar .bar {
    --height: 15px;
    height: var(--height);
    line-height: var(--height);
    overflow: hidden;
    position: relative;
    white-space: nowrap;
    width: 100%;
    display: flex;
    border-radius: 3px;
}

.b-stats_bar .bar .first {
    background: #2a7f50;
	float:left;
}

.b-stats_bar .bar .second {
    background: #4eb37a;
	float:left;
}

.b-stats_bar .bar .third {
    background: #aaa;
	float:right;
}

.b-stats_bar .bar div {
    color: white;
    cursor: default;
    display: inline-block;
    font-size: 11px;
    font-weight: normal;
    height: inherit;
    line-height: inherit;
    text-align: center;
    white-space: nowrap;
}

.b-stats_bar .stat_names {
    font-size: 11px;
    line-height: 1.65;
}

.b-stats_bar .stat_names .stat_name {
    display: inline-block;
    -webkit-transition: opacity .14s ease-in-out;
            transition: opacity .14s ease-in-out;
}

.b-stats_bar .stat_names .stat_name a {
    color: #123;
    cursor: pointer;
}

.b-stats_bar .stat_names .stat_name .size {
    display: inline-block;
    white-space: normal;
}

.b-stats_bar .stat_names .stat_name:after {
    color: #9da2a8;
    content: '/';
    display: inline-block;
    font-weight: normal;
    padding: 0 7px;
}

.b-stats_bar .stat_names .stat_name:last-child:after {
    content: '';
}

.favmod-menu {
    display: flex;
    flex-direction: column;
}

#fav_category, #fav_type { width:70%; text-align:center }
.fav_category, .fav_type_list { list-style: none; padding: 0; margin: 0 }
	.fav_category, .fav_type_list { 
        display: flex;
        line-height: 27px;
        margin: 20px;
        gap: 10px;
        flex-wrap: wrap;
    }
	.fav_category span, .fav_type_list span{ 
        background-color: #0000002e;
        padding: 0px 3px;
        border-radius: 3px;
        font-weight: 500; }
	.fav_category > li,  .fav_type_list > li { display: inline }
	.fav_category > li:first-child, .fav_type_list > li:first-child { margin: 0 }

	.fav_category > li a, .fav_type_list > li a { color: #353535; padding:5px; text-decoration: none; border-radius: 3px; border: 1px solid transparent; }
	.fav_category li:first-child .cl2, .fav_type_list li:first-child .cl2 {border-radius: 3px 0 0 3px }
	.fav_category li:last-child .cl2, .fav_type_list li:last-child .cl2 {border-radius: 0 3px 3px 0 }
	
	.fav_type_list > li.owner_list a { 
        background: rgb(64 220 83 / 18%);
        border-color: #0a930169;
    }

	.fav_category > li.active a, .fav_type_list > li.active a { 
        background: rgba(64,148,220,.45);
        border-color: #016a9380; 
    }

    .fav_category > li a:hover, .fav_type_list > li a:hover { background: rgba(53, 53, 53, .14) }
/* --- Favorites end --- */