﻿/* bengali language ---------------------------------------*/
@font-face {
    font-family: 'Siyam Rupali';
    src: url('../../fonts/Siyamrupali.ttf') format('truetype');
}

@font-face {
    font-family: 'Siyam Rupali ANSI';
    src: url('../../fonts/Siyam Rupali ANSI.ttf') format('truetype');
    unicode-range: U+30-39;
}

body:lang(bn) {
    font-family: 'Siyam Rupali ANSI', 'Siyam Rupali', Helvetica, Tahoma, Arial, sans-serif !important;
}

.do-not-change-ANSI-font {
    font-family: 'Siyam Rupali', Helvetica, Tahoma, Arial, sans-serif !important;
}

.ui-dialog .ui-dialog-title:lang(bn) {
    margin-bottom: 0;
}

/* unset roundness ---------------------------------------*/
.box, .ui-corner-top, section.content > .s-DataGrid,
.s-QuickSearchBar, .quick-search-icon, .s-QuickSearchInput, .quick-filters-bar,
.btn, .tool-button, .button-outer, .inplace-button,
.select2-choice, .select2-arrow, .select2-drop,
input, textarea {
    border-radius: 1px !important;
}

/*.tool-button, .button-outer, button-inner {
    border-color: #ddd !important;
    background-color: #ddd !important;
}

    .tool-button:hover, .button-outer:hover, button-inner:hover {
        border-color: #eee !important;
        background-color: #eee !important;
    }

    .tool-button:active, .button-outer:active, button-inner:active {
        border-color: #fff !important;
        background-color: #fff !important;
    }*/

/* Form Styles ---------------------------------------*/
.field > input, .field > textarea,
.field > .select2-container > .select2-choice,
.field > .select2-container > .select2-choices {
    border-left-width: 5px !important;
}

.required:not(.readonly),
.required:not(.readonly) > .select2-choice,
.required:not(.readonly) > .select2-choices {
    border-left-color: #f77 !important;
}

.field > .caption > sup {
    display: none !important;
}

.field > .s-MonthYearEditor {
    padding-left: 6px;
}

/* Dialog Styles ---------------------------------------*/
.ui-dialog .ui-dialog-titlebar {
    background-color: gray;
}

.ui-dialog .ui-dialog-title {
    font-weight: 600;
}

.s-Dialog .s-DialogToolbar {
    padding-left: 8px;
}

/*.s-Dialog > .size {
    width: 750px;
    height: 600px;
}*/

/*.s-PropertyGrid .categories {
    height: 400px;
}*/

.s-Form .caption {
    text-align: left;
    padding-left: 5px;
    padding-right: 0px;
    width: 150px;
}

    .s-Form .caption sup {
        float: right;
        top: 10px;
        font-size: 15px;
    }

.emaildomain {
    width: 200px;
}

.row-reversed {
    flex-direction: row-reverse;
}

.no-label, .field-only {
    padding-left: 5px;
}

    .no-label label.caption, .field-only label.caption {
        display: none;
    }

.label-only > label {
    width: 90% !important;
}

.label-only > input {
    display: none;
}

.label-subcategory {
    margin: 0px 10px 8px 10px;
    border-bottom: 1px dotted #7380C4;
    width: 100%;
}

.label-subcategory > input {
    display: none;
}

.label-subcategory > label.caption {
    font-weight: bold !important;
    color: cornflowerblue;
    padding-left: 0px;
    width: 90% !important;
}

.offset-field {
}

    .offset-field label {
        display: none;
    }

    .offset-field input {
        display: none;
    }



@media (min-width: 768px) {
    .width2 {
        flex: auto !important;
        width: 16.5% !important;
    }

        .width2 .caption {
            width: 90px;
        }
}

@media (min-width: 768px) {
    .width-1percent {
        flex: auto !important;
        width: 1% !important;
    }

        .width-1percent .caption {
            width: 100%;
        }
}

@media (min-width: 768px) {
    .width3 {
        flex: auto !important;
        width: 25% !important;
    }
}

@media (min-width: 768px) {
    .width4 {
        flex: auto !important;
        width: 33% !important;
    }

        .width4 .caption {
            width: 90px;
        }
}

@media (min-width: 768px) {
    .width6 {
        flex: auto !important;
        width: 50% !important;
    }
}

@media (min-width: 768px) {
    .width9 {
        flex: auto !important;
        width: 73% !important;
    }
}

.ui-widget-overlay {
    background-color: #000;
    opacity: 0.2;
    cursor: not-allowed;
}

/* Grid Styles ---------------------------------------*/
.slick-header-column {
    text-align: center;
}

.slick-cell {
    border-left: 1px solid #ddd !important;
    border-width: thin !important;
}

    .slick-cell.r0 {
        border-left: none !important;
    }

    .slick-cell.editable {
        border-style: none;
    }

.rownum-column {
    background-color: #f7f7f7 !important;
    border-bottom: none;
    text-align: center;
}

.inline-actions-column {
    /*background-color: #f7f7f7 !important;
    border-bottom: none;*/
    /*right: 0 !important;*/
    width: max-content;
}

.quick-filter-item .inplace-button {
    float: right;
    padding-top: 2px;
    vertical-align: top;
    margin-top: 3px;
}

.quick-filter-item .has-inplace-button {
    margin-right: 0;
}

.quick-filter-item .inplace-search {
}

.quick-filter-item .inplace-create {
    display: none;
}

/*.quick-filter-item .s-LookupEditor {
    width: 230px;
}*/

.quick-filter-item .s-DateEditor.dateQ {
    width: 100px;
}

.inline-actions {
    opacity: 0.80;
    cursor: pointer;
}

    .inline-actions :hover {
        text-shadow: 0px 0px 1px #111;
        opacity: 1;
    }

.slick-row:hover {
    /*background: none repeat scroll 0 0 #f1f1ef;*/
    text-shadow: 0px 0px 1px #ccc;
}

/* Slick.Editors.Text, Slick.Editors.Date */
input.editor-text {
    width: 100%;
    height: 100%;
    border: 0;
    margin: 0;
    background: transparent;
    outline: 0;
    padding: 0;
}

.slick-cell .ui-datepicker-trigger {
    margin-top: 2px;
    padding: 0;
    vertical-align: top;
    float: right !important;
    position: absolute;
    right: 2px;
    top: 0px;
}

#ui-datepicker-div {
    z-index: 3000 !important;
}

img.ui-datepicker-trigger {
    width: 22px;
    height: 22px;
    padding: 2px;
    top: 0!important;
}
/* Slick.Editors.YesNoSelect */
select.editor-yesno {
    width: 100%;
    margin: 0;
    vertical-align: middle;
}
/* Slick.Editors.Checkbox */
input.editor-checkbox {
    margin: 0 !important;
    height: 100%;
    padding: 0;
    border: 0;
}

.slick-cell {
    /* Slick.Editors.Select2 */
}

    .slick-cell .select2-container {
        width: 104%;
        top: -2px;
        left: -5px;
    }

input.s-DateTimePickerEditor {
    padding: 3px 6px;
    border: 1px solid #ccc;
    border-radius: 3px;
}
/* make bootstarp dropdown menu compatilbe with slick grid */
.cell-overflowed {
    overflow: visible;
}

.slick-group > .slick-cell,
.no-z-index {
    z-index: auto;
}

.z-indexed-dropdown {
    z-index: 999999;
    border: 1px solid gray;
}

ul.list-inline {
    padding: 5px 20px;
}

.btn-customized-save .button-inner {
    background-image: url(../../Content/serenity/images/disk-arrow.png);
}

/* grid cardview. ---------------------------------------*/

.view-switch {
    position: relative;
    top: -10px;
}

.card-container {
    overflow-y: scroll;
    overflow-x: hidden;
    background-color: #ecf0f5;
}

    .card-container .card-items {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        padding: 10px 0px;
    }

    .card-container .card-item {
        /*flex: 0 1 calc(100% - 4px);*/
        padding: 8px;
        background-color: #fff;
        box-shadow: 1px 2px 3px rgba(0,0,0,.2);
        /*height: 130px;*/
        overflow: hidden;
        margin: 10px;
    }

        .card-container .card-item table {
            width: 100%;
            table-layout: fixed;
        }

        .card-container .card-item td {
            padding: 4px;
        }

            .card-container .card-item td.img {
                width: 116px;
            }

                .card-container .card-item td.img img {
                    width: 100px;
                }

        .card-container .card-item .name {
            font-weight: bold;
        }

/*@media(min-width: 900px) {
    .card-container .card-item {
        flex-basis: calc(50% - 12px)
    }
}

@media(min-width: 1600px) {
    .card-container .card-item {
        flex-basis: calc(33% - 12px)
    }
}*/

.favorite-views {
    margin-right: 4px;
    position: relative;
    top: -12px;
}

    .favorite-views ul {
        font-size: 12px;
        width: 150px;
        min-width: 150px;
    }

    .favorite-views li.save {
        padding: 6px;
    }

        .favorite-views li.save input {
            margin-top: 2px;
            width: 126px;
        }

        .favorite-views li.save button {
            margin-top: 4px;
            font-size: 12px;
        }

    .favorite-views li.fav {
        position: relative;
        padding-right: 16px;
    }

    .favorite-views i.fa-trash-o {
        cursor: pointer;
        position: absolute;
        right: 4px;
        top: 5px;
        color: #800000;
    }

/*To show scroll on left navigation*/
.slimScrollBar {
    background: none repeat scroll 0 0 #ddd !important;
    width: 10px !important;
}

/* Misc. ---------------------------------------*/
.info-window dt {
    float: left;
    clear: left;
    width: 100px;
    font-weight: bold;
}

.info-window dd {
    float: left;
    margin: 5px 0px 5px 50px;
}

.vis-item .vis-item-overflow {
    overflow: visible;
}

.left-indent-2 {
    padding-left: 20px;
}

.left-indent-3 {
    padding-left: 40px;
}

.left-indent-4 {
    padding-left: 60px;
}

.full-width {
    width: 100% !important;
}
