/*
 * This file is part of  the extension: Ebla Enum Plus
 * Copyright (c) Eblasoft Bilişim Ltd.
 *
 * This Software is the property of Eblasoft Bilişim Ltd. and is protected
 * by copyright law - it is NOT Freeware and can be used only in one project
 * under a proprietary license, which is delivered along with this program.
 * If not, see <http://eblasoft.com.tr/eula>.
 *
 * This Software is distributed as is, with LIMITED WARRANTY AND LIABILITY.
 * Any unauthorised use of this Software without a valid license is
 * a violation of the License Agreement.
 *
 * According to the terms of the license you shall not resell, sublicense,
 * rent, lease, distribute or otherwise transfer rights or usage of this
 * Software or its derivatives. You may modify the code of this Software
 * for your own needs, if source code is provided.
 */

.option-color-picker {
    width: 16px;
    height: 16px;
    position: absolute;
    right: 6px;
    top: 8px;
    border-radius: 100%;
    border: 1px solid #555555;
}

/* old kanban bar style */

div.list-kanban.triangle > div > table th.group-header:first-child > div {
    border-top-left-radius: var(--border-radius) !important;
    border-bottom-left-radius: var(--border-radius) !important;
}

div.list-kanban.triangle > div > table th.group-header:last-child > div {
    width: 100%;
    border-top-right-radius: var(--border-radius) !important;
    border-bottom-right-radius: var(--border-radius) !important;
}

div.list-kanban.triangle > div > table th.group-header:last-child > div:after, div.list-kanban.triangle > div > table th.group-header:last-child > div:before {
    display: none;
    content: ""
}

div.list-kanban.triangle > div > table th.group-header > div {
    padding-left: 8px;
    position: relative;
    line-height: 28px;
    height: 100%;
    width: calc(100% - 7px);
    background-color: var(--label-default-bg);
    border-radius: 0 !important;
}

div.list-kanban.triangle > div > table th.group-header > div:after, div.list-kanban.triangle > div > table th.group-header > div:before {
    content: " ";
    display: inline-block;
    width: 0;
    height: 0;
    border-top-width: 14px;
    border-left-width: 18px;
    border-bottom-width: 14px;
    border-right-width: 0;
    border-color: var(--label-default-bg);
    border-style: solid;
    position: absolute
}

div.list-kanban.triangle > div > table th.group-header > div:before {
    left: calc(100%);
    z-index: 2;
    border-top-color: transparent;
    border-bottom-color: transparent
}

div.list-kanban.triangle > div > table th.group-header > div:after {
    border-left-color: transparent;
    left: calc(100% + 0px);
}

div.list-kanban.triangle > div > table th.group-header.group-header-success > div {
    background-color: var(--brand-success)
}

div.list-kanban.triangle > div > table th.group-header.group-header-success > div:before {
    border-left-color: var(--brand-success) !important;
}

div.list-kanban.triangle > div > table th.group-header.group-header-before-success > div:after {
    border-color: var(--brand-success) var(--brand-success) var(--brand-success) transparent
}

div.list-kanban.triangle > div > table th.group-header.group-header-danger > div {
    background-color: var(--brand-danger)
}

div.list-kanban.triangle > div > table th.group-header.group-header-danger > div:before {
    border-left-color: var(--brand-danger)
}

div.list-kanban.triangle > div > table th.group-header.group-header-before-danger > div:after {
    border-color: var(--brand-danger) var(--brand-danger) var(--brand-danger) transparent
}

div.list-kanban.triangle > div > table th.group-header.group-header-warning > div {
    background-color: var(--brand-warning)
}

div.list-kanban.triangle > div > table th.group-header.group-header-warning > div:before {
    border-left-color: var(--brand-warning)
}

div.list-kanban.triangle > div > table th.group-header.group-header-before-warning > div:after {
    border-color: var(--brand-warning) var(--brand-warning) var(--brand-warning) transparent
}

div.list-kanban.triangle > div > table th.group-header.group-header-primary > div {
    background-color: var(--brand-primary)
}

div.list-kanban.triangle > div > table th.group-header.group-header-primary > div:before {
    border-left-color: var(--brand-primary)
}

div.list-kanban.triangle > div > table th.group-header.group-header-before-primary > div:after {
    border-color: var(--brand-primary) var(--brand-primary) var(--brand-primary) transparent
}

div.list-kanban.triangle > div > table th.group-header.group-header-info > div {
    background-color: var(--brand-info)
}

div.list-kanban.triangle > div > table th.group-header.group-header-info > div:before {
    border-left-color: var(--brand-info)
}

div.list-kanban.triangle > div > table th.group-header.group-header-before-info > div:after {
    border-color: var(--brand-info) var(--brand-info) var(--brand-info) transparent
}

div.list-kanban.triangle > div > table td.group-column {
    vertical-align: top;
    padding-top: 10px
}

div.list-kanban.triangle > div > table td.group-column > div {
    height: 100%
}

div.list-kanban.triangle > div > table td.group-column .show-more a {
    margin: 0 auto 8px;
    display: block;
    height: 20px
}

div.list-kanban.triangle > div > table td.group-column .show-more a > span {
    top: -4px;
    color: var(--text-muted-color);
    position: relative
}

div.list-kanban.triangle > div > table td.group-column .group-column-list {
    min-height: 100px
}

div.list-kanban.triangle > div > table td.group-column .group-column-list.drop-active {
    height: calc(100%)
}

div.list-kanban.triangle > div > table td.group-column .group-column-list.drop-hover {
    border-top: 2px solid var(--gray-light)
}

div.list-kanban.triangle > div > table .item {
    margin-bottom: 10px
}

div.list-kanban.triangle > div > table .item .panel {
    margin-bottom: 0
}

div.list-kanban.triangle > div > table .item .panel .form-group {
    margin-bottom: 3px
}

div.list-kanban.triangle > div > table .item .panel .form-group .field-right-align {
    text-align: right
}

div.list-kanban.triangle > div > table .item .panel .form-group .field {
    overflow-wrap: break-word;
    word-wrap: break-word;
    font-size: 14px;
    overflow: hidden
}

div.list-kanban.triangle > div > table .item .panel .form-group .field.field-large {
    font-size: 18px;
    color: var(--gray)
}

div.list-kanban.triangle > div > table .item .panel div:last-child > .form-group {
    margin-bottom: 0
}

div.list-kanban.triangle > div > table .item .panel .panel-body {
    padding: 8px
}

div.list-kanban.triangle > div > table .item .panel .item-menu-container {
    margin-top: -10px;
    margin-right: -10px
}

div.list-kanban.triangle > div > table .item .panel .item-menu-container .dropdown-toggle:focus:focus-visible {
    outline: 0
}

div.list-kanban.triangle > div > table .item .panel .field span {
    user-select: none
}

div.list-kanban.triangle > div > table .item.ui-sortable-helper {
    cursor: grabbing
}

div.list-kanban.triangle > div > table .item.ui-sortable-helper a {
    cursor: grabbing
}

.list-kanban.triangle-container {
    overflow-x: auto;
    overflow-y: hidden
}

.list-kanban.triangle {
    overflow: hidden;
    padding-right: 3px
}

.list-kanban.triangle > .kanban-columns-container {
    margin-left: -10px;
    margin-right: -10px
}

.list-kanban.triangle > .kanban-columns-container > table {
    border-collapse: separate;
    border-spacing: 10px 0
}

.list-kanban.triangle .kanban-head-placeholder {
    height: 28px
}

.list-kanban.triangle .kanban-head-container {
    box-shadow: var(--default-box-shadow)
}

.list-kanban.triangle .kanban-head-container.sticked {
    position: fixed;
    top: 0;
    z-index: 4;
    overflow: hidden
}