YetiForceCompany/YetiForceCRM

/* {[The file is published on the basis of YetiForce Public License 6.5 that can be found in the following directory: licenses/LicenseEN.txt or yetiforce.com]} */

//table
@use "sass:math";

.table thead th,
.table-bordered thead td {
    border-bottom-width: 1px;
}

.btn-xs {
    @include button-size(
        math.div($btn-padding-y-sm, 1.25),
        math.div($btn-padding-x-sm, 1.25),
        math.div($font-size-sm, 1.25),
        math.div($btn-line-height-sm, 1.25),
        math.div($btn-border-radius-sm, 1.25)
    );
}

//Switch button
label.btn[class*="btn-outline-"] {
    &:not(.active) {
        background: $white;

        &:hover {
            background: $gray-200;
            color: $gray-600;
        }
    }
}

.dropdown-menu {
    max-height: calc(100vh - 100px);
    max-width: calc(100vh - 100px);
    overflow: auto;

    @at-root .listViewEntries .actions #{&} {
        overflow: unset;
    }

    &.historyList {
        @include media-breakpoint-up(md) {
            left: auto;
            right: 9px;
        }
    }
}

.dropdown-item {
    cursor: pointer;
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;

    @at-root .historyList #{&} {
        min-width: 500px;
        max-width: calc(100vh - 100px);
    }

    &:hover {
        border-top: 1px solid $color-grey-light;
        border-bottom: 1px solid $color-grey-light;
    }
}

//btn-group with flex-column on mobile styles correction
@include media-breakpoint-down(xs) {
    .btn-group.flex-column {
        & > .btn {
            margin-left: 0 !important;
        }

        & > .btn:first-child {
            -webkit-border-radius: 0.25rem 0.25rem 0 0 !important;
            -moz-border-radius: 0.25rem 0.25rem 0 0 !important;
            border-radius: 0.25rem 0.25rem 0 0 !important;
        }

        & > .btn:last-child {
            -webkit-border-radius: 0 0 0.25rem 0.25rem !important;
            -moz-border-radius: 0 0 0.25rem 0.25rem !important;
            border-radius: 0 0 0.25rem 0.25rem !important;
        }
    }
}

// buttons with class border has the same border color as input
.border.btn {
    border-color: #ced4da !important;
}

.input-group.input-group-sm {
    min-width: calculate-rem(65px);
}

.modal-header {
    padding: 1rem 0;
    margin: 0 1rem;
}

.modal-footer {
    border-top: none;
}

.modal-header-icon {
    margin-right: 0.5rem;
}

.modal-header-xl {
    align-items: center;
    padding: 0.5rem 0;
    .modal-title {
        font-size: 1.5rem;
        display: flex;
        align-items: center;
    }
    .modal-header-icon {
        font-size: 2.5rem;
        margin-right: 0.75rem;
    }

    .close {
        margin: 0;
        padding: 0 0 5px 0;
    }
}

.nav-under {
    .active {
        border-bottom: solid 2px;
    }
    .nav-link {
        padding: calculate-rem(3px) calculate-rem(4px);
        @include media-breakpoint-up(sm) {
            margin-right: calculate-rem(60px);
        }
    }
}
.input-group-sm {
    .form-control {
        @extend .form-control-sm;
    }
}
.input-group-lg {
    .form-control {
        @extend .form-control-lg;
    }
}
@include media-breakpoint-down(sm) {
    .breadcrumb {
        padding: 0;
    }
    .breadcrumb-item + .breadcrumb-item {
        padding-left: calculate-rem(2px);
        &::before {
            padding-right: calculate-rem(2px);
        }
    }
}

.table-with-flex {
    border-right: none;
    td {
        border-left: none;
        border-bottom: none;
        border-right: $table-border-width solid $table-border-color;
    }
}