.addlist {width: 100%; position: relative; font-size: 14px;}
.trigger, .addlist > div, .expanded-options .option, .edit-trigger {display: flex; align-items: center; gap: 10px;}

/* Только у trigger — цвет фона. У .text больше фона нет */
.trigger {
    background-color: rgba(255, 255, 255, 0.1);
    color: #fff;
    flex: 1 1 0;
    min-width: 50px;
    max-width: 100%;
}

.option .text {
    color: #fff;
}

.addlist svg {display: block; width: 14px; aspect-ratio: 1/1; fill: var(--accent);}
.trigger-arrow::before, .edit-trigger:has(.text:first-child)::before {font-weight: 300; font-family:'Font Awesome 5 Pro';}

.trigger {border: 2px solid var(--accent); border-radius: 4px; justify-content: center; position: relative;
    height: 50px; font-weight: 500; color: var(--accent); cursor: pointer;}
.edit-trigger:has(.text:first-child)::before {content:"\f055";}
.favorites-addnote, .favorites-addlist {cursor: pointer; height: 50px; aspect-ratio: 1/1; display: grid; place-items: center;
    background-color: var(--bg-darker); color: var(--tt-fade); border-radius: 4px; display: none;}
.trigger-arrow::after {content: ''; position: absolute; inset: 0; z-index: 3;}
.trigger-arrow > div {display: none;}
.trigger-arrow::before {content:"\f078";}
.favorites-addnote svg, .favorites-addlist svg, .expanded-options svg {fill: var(--tt-fade);}

.expanded-options {position: absolute; left: 0; top: 100%; min-width: 100%; z-index: 100; background-color: #4e5368;
    border-radius: 10px; box-shadow: var(--bsh-popover); padding: 15px; width: max-content; display: none;}

.expanded-options .option {cursor: pointer; padding: 8px 15px; border-radius: 6px; font-size: 14px;
    transition: background-color .15s ease, color .15s ease;}

.expanded-options .option.is-active {background-color: var(--accent-2); color: #fff;}

/* Ховер — зелёный, заметный */
.expanded-options .option:hover {
    background-color: rgba(121, 193, 66, 0.35);
    color: #fff;
}

.expanded-options .option:hover .text,
.expanded-options .option:hover .status-name {
    color: #fff;
}

.expanded-options .option:hover svg {
    fill: #fff;
}

.expanded-options .option.is-active svg,
.trigger:hover svg,
.addlist.active .trigger svg {fill: #fff;}

.option.remove-trigger, .option.remove-trigger svg {color: var(--red); fill: var(--red);}
.option.remove-trigger:hover {background-color: rgba(239, 90, 90, 0.25);}

.trigger:hover, .addlist.active .trigger {background-color: var(--accent); color: #fff;}
.dt .trigger, .dt .trigger svg  {color: #fff; fill: #fff;}

#sidebar-fav-list {display: flex; flex-direction: column; gap: 10px;}
.line {display: flex; align-items: center;}
.x_label {width: 150px; text-align: right; font-size: 13px; order: 10; white-space: nowrap; line-height: 1;}
.line:nth-child(1), .ufavs__bar-fill:nth-child(1), .ufavs__btn:nth-child(1) {--clr: #26a65b;}
.line:nth-child(2), .ufavs__bar-fill:nth-child(2), .ufavs__btn:nth-child(2) {--clr: #3f8ecb;}
.line:nth-child(3), .ufavs__bar-fill:nth-child(3), .ufavs__btn:nth-child(3) {--clr: #d76a79;}
.line:nth-child(4), .ufavs__bar-fill:nth-child(4), .ufavs__btn:nth-child(4) {--clr: #4c4c4c;}
.line:nth-child(5), .ufavs__bar-fill:nth-child(5), .ufavs__btn:nth-child(5) {--clr: #d2914b;}
.line:nth-child(6), .ufavs__bar-fill:nth-child(6), .ufavs__btn:nth-child(6) {--clr: #da612d;}
.bar-container {height: 15px; flex-grow: 1; background-color: var(--bg-darker);}
.bar {height: 100%; background-color: var(--clr); border-radius: inherit; min-width: 20px; position: relative;}
.bar div {font-size: 12px; line-height: 1; position: absolute; left: 100%; top: 50%; translate: 5px -50%;}

.ufavs {margin-top: 20px;}
.ufavs .btn {font-weight: 400; font-size: 12px; text-transform: uppercase;}
.ufavs__bar {height: 10px; background-color: var(--bg-darker);}
.ufavs__bar-fill {background-color: var(--clr); color: #fff; font-size: 12px; text-align: center;}
.ufavs__btns > * {flex-grow: 1;}
.ufavs__btn a {background-color: var(--clr);}

.item-short .addlist {width: auto; z-index: 10; margin-left: auto;}
.item-short .trigger {height: 30px; padding: 0 10px; font-size: 12px; font-weight: 400; border-width: 1px;}
.item-short .option {font-weight: 400; --tt: #000; color: #000;}
.dt .item-short .option {--tt: #ccc; color: #ccc;}
.item-short:has(.addlist.active), .item-short:hover {z-index: 15;}
@media screen and (max-width: 760px) {
    .item-short .addlist {width: 100%; margin: 0; margin-top: 15px;}
}
.favs-links {margin-bottom: 20px;}
.favs-links ul {display: flex; align-items: center; flex-wrap: wrap; gap: 5px 5px;}
.fav_category, .fav_type_list {margin: 0;}
.fav_type_list > li.active a { background-color: var(--accent); border-color: var(--extFav_list_current_border); color:
var(--extFav_list_current_text); }
.favs-links a {display: block; padding: 10px 10px; border-radius: 4px; background-color: var(--bg-darker);
    font-size: 12px; text-transform: uppercase; line-height: 1;}
.favs-links a:hover {background-color: var(--accent); color: #fff;}