/*** Beegap-web's own style customization */

/** Input and select */
/* when an input group addon is to be placed between two fields, we call it .input-group-middle */
.input-group-middle span {
    border-radius: 0;
}

/* make all form fields the same height (really now? this isn't the default?) */
select,
input[type="text"],
input[type="email"],
input[type="number"],
input[type="date"] {
    height: 38px;
}

/* Cursors in disabled fields */
button:disabled,
input:disabled,
select:disabled,
textarea:disabled {
    cursor: not-allowed;
}

/* pretend disabled <input> field that's really just a <p> */
p.data-display-box, p.computed-display-box, div.data-display-box, div.computed-display-box {
    background-color: #e9ecef;
    border: 1px solid #e3e3e3;
    color: #565656;
    min-height: 38px;
    padding: 9px 10px 7px 10px;
    border-radius: 4px;
    margin: 0 0;
    line-height: 1.5 !important;
}

.data-display-box>ul {
    margin-bottom: 0;
    padding: 0;
    list-style-position: inside;
}

.data-display-box>ul.fa-ul {
    list-style-position: outside !important;
    margin-left: 1.5em;
}

.table-display-box>tbody {
    background-color: #e9ecef;
    border-radius: 4px;
}

/** Textarea */
/* Make <textarea> resize instantaneous, ie. apply a transition only to the border color. */
textarea.form-control {
    -webkit-transition: border-color 300ms linear;
    -moz-transition: border-color 300ms linear;
    -o-transition: border-color 300ms linear;
    transition: border-color 300ms linear;
}

/** Switchery */
/* margins */
.switchery {
    margin-top: 3px;
    margin-bottom: 3px;
}

.switchery:not(.switchery-small) > small {
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Yes/no label on switch */
.switchery:not(.switchery-small) > small:not(.sw-on):after {
    content: "OFF";
    font-weight: bold;
}

.sw-on:after {
    content: "ON";
    font-weight: bold;
}

.switchery:not(.switchery-small) > small[data-on-text].sw-on:after {
    content: attr(data-on-text);
}

.switchery:not(.switchery-small) > small[data-off-text]:not(.sw-on):after {
    content: attr(data-off-text);
}

/* Fullcalendar */
.fc-content {
    color: #000;
}
.fc-time-grid-event {
    border: 3px solid;
}

/* Cursor on disabled switch */
input[type="checkbox"]:disabled + span.switchery {
    cursor: not-allowed;
}

/* Fieldset spacing */
fieldset {
    margin-bottom: 2em;
}

fieldset:last-child {
    margin-bottom: 0;
}

/* non-glowing border on focused fields */
.is-invalid.form-control:focus {
    box-shadow: 0 0 0 0;
}

/* small button controls inside tables */
tbody .btn.btn-sm, thead .btn.btn-sm, tfoot .btn.btn-sm {
    height: 30px;
    width: 30px;
}

/* small button controls with longer text inside tables */
tbody .btn.btn-sm-text, thead .btn.btn-sm-text, tfoot .btn.btn-sm-text {
    height: 30px;
    padding: 4px 8px;
}

.table td .btn-group {
    margin: -0.65rem;
}

/* vertical align in tables */
.table td {
    vertical-align: middle;
}

/* user picture spacing inside tables */
.table td img {
    margin-right: 1em;
}

/* active icon button */
a>i.active {
    color: #71b6f9;
}

/* notification number badge */
.noti-badge {
    position: relative;
    top: -35px;
    left: -5px;
    margin-bottom: -100%;
    cursor: pointer;
}
.noti-delete {
    position: absolute;
    padding: 0;
    margin: 0 auto;
    right: 1em;
    top: 1em;
}
.btn-dropdown-no-arrow:after {
    content: none;
}
.btn-group>.dropdown>.dropdown-toggle {
    border-radius: 0;
}

/* Fix bootstrap tabs */
.nav-link {
    border-width: 2px !important;
}

.nav-link.active {
    border-color: #eeeeee !important;
    border-bottom: 2px solid #ffffff !important;
    margin-bottom: -2px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.nav-link:focus {
    margin-bottom: -2px;
}

.nav-link:hover {
    margin-bottom: -2px;
}

/* Label for required form fields */
.form-label-required:before {
    content: "*";
}

/* Button groups border-radius fix */
.btn-group .btn:first-of-type {
    border-radius: 4px 0 0 4px;
}

.btn-group .btn:not(:first-of-type, :last-of-type) {
    border-radius: 0 0 0 0;
}

.btn-group .btn:last-of-type {
    border-radius: 0 4px 4px 0;
}

.btn-group > :first-of-type .btn {
    border-radius: 4px 0 0 4px;
}

.btn-group > :not(:first-of-type, :last-of-type) .btn {
    border-radius: 0 0 0 0;
}

.btn-group > :last-of-type .btn {
    border-radius: 0 4px 4px 0;
}

.btn-group > .btn:only-of-type {
    border-radius: 4px;
}

.dropdown-menu.show {
    z-index: 998 !important;
}

.toast-top-full-width > .toast {
    max-width: 90% !important;
}