/* radio button */

.nav-item input[type="radio"] + label, .nav-link{
    height: 100% !important;
    width: 100%;
}

.nav-item input[type="radio"] + label {
    font-size: var(--font-size-14px);
    padding: 0 !important;
    padding: 6px !important;
    text-transform: uppercase;
    cursor: pointer;
    color: var(--text-color-discard) !important;
    width: 120px;
    text-align: center;
    margin: 0 !important;
}

.nav-item input[type="radio"]#published + label{
    border-left: var(--border) solid var(--text-color-discard) !important;
    border-top: var(--border) solid var(--text-color-discard) !important;
    border-bottom: var(--border) solid var(--text-color-discard) !important;
    /* border-radius: 5% 0 0 5%; */
}

.nav-item input[type="radio"]#unpublished + label{
    border-right: var(--border) solid var(--text-color-discard) !important;
    border-top: var(--border) solid var(--text-color-discard) !important;
    border-bottom: var(--border) solid var(--text-color-discard) !important;
    /* border-radius: 0 5% 5% 0; */
}

.nav-item input[type="radio"]#published:checked + label{
    /* border-right: var(--border) solid var(--color-published) !important; */
    border-left: var(--border) solid var(--color-published) !important;
    border-top: var(--border) solid var(--color-published) !important;
    border-bottom: var(--border) solid var(--color-published) !important;
    background-color: #E6F8D4;
    color: var(--color-published) !important;
}

.nav-item input[type="radio"]#published + label:hover {
    color: var(--color-published) !important;
}

.nav-item input[type="radio"]#unpublished:checked + label{
    border-bottom: var(--border) solid var(--color-unpublished) !important;
    border-top: var(--border) solid var(--color-unpublished) !important;
    border-right: var(--border) solid var(--color-unpublished) !important;
    /* border-left: var(--border) solid var(--color-unpublished) !important; */
    background-color: #FFCD95;
    color: var(--color-unpublished) !important;
}

.nav-item input[type="radio"]#unpublished + label:hover {
    color: var(--color-unpublished) !important;
}