/* before writes any new classes, MUST verify if Bootstrap does */
/* https://getbootstrap.com/docs/4.3.1/getting-started/introduction/ */
/* imports */
@import "sidebar.css";
@import "cards.css";
@import "fonts.css";
@import "buttons.css";
@import "colors.css";
@import "responsive.css";
@import "title_bar.css";
/*@import url("colors.css");*/
/* general stuff */

body {
  background-color: #F2F2F2;
  font-family: 'Roboto', sans-serif;
}

*,
body,
html {
  margin: 0;
  padding: 0;
}

html,
body,
#wrap,
#main,
#sidebar {
  height: 100%;
}

body.toggled {
  overflow: hidden;
}

#wrap {
  min-height: 100%;
}

#main {
  padding: 70px 0 0 0;
  margin-left: 220px;
}

#timer_nav,
#alert_nav {
  height: 70px;
}

#timer_nav,
.main-nav,
#alert_nav {
  margin-left: 220px;
  z-index: 1130;
}

#main,
#timer_nav,
.main-nav {
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

.cursor-pointer {
  cursor: pointer;
}

.vcenter,
.vcenter-input-txt {
  display: block;
}

.vcenter {
  margin-top: 5px;
}

.vcenter-input-txt {
  padding-top: 8px;
}

.content {
  padding-top: 15px;
}

.xtra-space {
  padding-bottom: 75px;
  margin-bottom: 75px;
}

.custom-radio .cp-single-label {
  padding-top: 5px;
}

.highlight {
  border-radius: 5px;
}

.alert {
  margin-bottom: 10px;
}

.text-underline {
  text-decoration: underline !important;
}

.fa-list-links {
  margin-left: 1.5em;
}

.fa-list-links>li>* {
  display: inline-block;
  vertical-align: middle;
}

.fa-list-links>li {
  margin: 1em 0;
  line-height: 16px;
}

.is-invalid {
  background-image: none !important;
}

.is-invalid+span span {
  border-color: #dc3545;
}

/* switch checkbox style */
.switch {
  position: relative;
  display: inline-block;
  width: 36px;
  height: 23px;
  margin-top: 5px;
}

.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.switch input:checked+.slider.ext {
  background-color: #A3D23A;
}

.switch input:checked+.slider {
  background-color: #2696F1;
}

.switch .slider.round {
  border-radius: 50px;
}

.switch .slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #D8D8D8;
  -webkit-transition: .4s;
  transition: .4s;
}

.switch input:checked+.slider:before {
  -webkit-transform: translateX(12px);
  -ms-transform: translateX(12px);
  transform: translateX(12px);
}

.switch .slider.round:before {
  border-radius: 50%;
}

.switch .slider:before {
  position: absolute;
  content: "";
  height: 22px;
  width: 22px;
  left: 1px;
  bottom: 0px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
  box-shadow: inset 0px -1px 0px rgba(0, 0, 0, 0.25);
}

/* divisor custom styles */
.col-divisor,
.col-divisor-bottom,
.col-divisor-custom {
  margin-right: -20px;
  margin-left: -20px;
}

.col-divisor,
.col-divisor-bottom {
  margin-top: 20px;
}

.col-divisor-custom {
  margin-top: 14px;
}

[v-cloak]>* {
  display: none !important;
}

.custom-file-label::after,
.custom-file-label {
  padding: 10px 15px !important;
}

/* input styles */
.btn,
input,
select {
  height: 36px !important;
  padding-top: 0;
  padding-bottom: 0;
}

textarea,
input[type=password],
input[type=text],
input[type=email],
input[type=tel],
input[type=search],
input[type=search] + .input-group-append .input-group-text,
.input-search+span span {
  box-shadow: inset 0px 2px 0px #ECECEC;
}

.disabled-el,
textarea:disabled,
input[type=text]:disabled,
input[type=email]:disabled,
input[type=tel]:disabled,
input[type=search]:disabled {
  background-color: #e9ecef !important;
}

.disabled-el {
  cursor: not-allowed;
}

input[type=checkbox] {
  height: auto !important;
}

input[readonly] {
  background-color: white !important;
}

label {
  margin-bottom: 5px;
}

/* end general stuff */

/* title_bar styles */
#timer_nav {
  height: 50px;
}

.main-nav {
  height: 70px;
  z-index: 1130;
}

#timer_nav span.banner_countdown span.title-big,
#timer_nav span.banner_expired span.title-big,
#timer_nav span.banner_default_welcome_message span.title-big {
  margin-top: .25rem !important;
  line-height: 9px;
}

.main-nav .navbar-toggler {
  color: white;
  margin-left: -10px;
}

.main-nav .navbar-text {
  flex: 1;
  min-width: 0;
}

/* end title_bar styles */

/* list styles */
.list-group-row {
  border: 1px solid rgba(0, 0, 0, .125);
}

.list-group-links {
  height: 211px;
  /* change when the btn-groups grow up*/
  overflow-y: auto;
}

.list-group-links.add-without-destinable {
  height: 246px !important;
}

.list-group-links .list-group .list-group-item,
.list-line-check a.list-group-item,
.list-line-numbers .list-group-item,
.cp-control .custom-label-block {
  padding: 10px;
}

.list-group-btns .btn-group-vertical button {
  text-align: left;
}

.list-group-btns .btn-group-vertical button {
  padding-left: 10px;
  padding-right: 10px;
  outline: 0 !important;
  box-shadow: none !important;
}

.list-group-row .list-group-btns .btn-group-vertical,
.list-group-btns .btn-group-vertical button:first-child,
.brl-tb-4 {
  border-top-left-radius: 4px !important;
}

.list-group-row .list-group-btns .btn-group-vertical,
.list-group-btns .btn-group-vertical button:last-child,
.brl-tb-4 {
  border-bottom-left-radius: 4px !important;
}

.list-group-row .list-group-links {
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

/* end list styles */

/*Search Stuff*/
.custom-list-users,
.custom-list-telephones {
  overflow-y: auto;
}

.custom-list-users {
  max-height: 300px;
}

.custom-list-telephones {
  max-height: 400px;
}

.no-results {
  height: 200px;
}

.data-links-rows.custom-list-users>div:first-child {
  padding-bottom: 15px;
}

.data-links-rows.custom-list-users>[class*="col-"]+[class*="col-"] {
  padding-top: 15px;
  padding-bottom: 15px;
}

.space-txt {
  padding-right: 6px;
}

/* end Search Stuff*/

.input-search:focus {
  border-color: #ced4da !important;
}

.input-search:focus,
.input-search:focus+span span {
  box-shadow: none !important
}

.input-search+span span i {
  font-size: 80%;
}

/* search popover styles */
.seachPopovers.popover {
  width: calc(100% - 10px);
  max-width: calc(100% - 10px);
  margin-top: -1px !important;
  left: 5px !important;
  transform: translate3d(0px, 36px, 0px) !important;
}

.seachPopovers.popover .arrow {
  display: none !important;
}

.seachPopovers.popover .popover-body {
  width: 100%;
  max-width: 100%;
  padding-left: 0;
  padding-right: 0;
}

.seachPopovers.popover .popover-body p,
.search-list button {
  font-family: 'Roboto', sans-serif !important;
}

.search-list button {
  border: 0 !important;
}

/* end search popover */

/* special features */

/* only safari */
_::-webkit-:not(:root:root),
.safari_only {
  margin-top: -2px;
}

/* only IE */
input::-ms-clear {
  display: none;
}



/* Safari 6.1-10.0 (not 10.1) */

@media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0) {
  /* @media {
    .navbar-text {
      padding-top: 0 !important;
      padding-bottom: 0 !important;
    }
  } */
}

/* Safari 10.1 */

@media not all and (min-resolution:.001dpcm) {
  @supports (-webkit-appearance:none) and (not (stroke-color:transparent)) {
    .navbar-text {
      padding-top: 0 !important;
      padding-bottom: 0 !important;
    }
  }
}

/* only firefox styles */
@-moz-document url-prefix() {
  .navbar-text {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
}

/* only internet explorer */
@supports (-ms-ime-align:auto) {
  .navbar-text {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
}

/* special, because doesn't work in group */
input.form-search::-moz-placeholder {
  font-style: italic !important;
}

input.form-search::placeholder {
  font-style: italic !important;
}

input.form-search::-webkit-input-placeholder {
  font-style: italic !important;
}

input.form-search:-ms-input-placeholder {
  font-style: italic !important;
}

input.form-search::-ms-input-placeholder {
  font-style: italic !important;
}

/* clears the 'X' from Internet Explorer */
input[type=search]::-ms-clear {
  display: none;
  width: 0;
  height: 0;
}

input[type=search]::-ms-reveal {
  display: none;
  width: 0;
  height: 0;
}

/* clears the 'X' from Chrome */
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
  display: none;
}

.dropdown-toggle-no-caret:after {
  content: none !important;
}

.full-overlay {
  z-index: 1100 !important;
}

.justify-elements {
  position: relative;
  -ms-flex: 1 1 0%;
  flex: 1 1 0%;
}

/* success only label radio buttons */
.new-radio-buttons.flags .custom-radio .custom-control-input:checked~.custom-control-label::after {
  margin-top: 12px;
}

.new-radio-buttons .custom-radio .custom-control-label::before,
.new-radio-buttons .custom-radio .custom-control-label::after {
  content: "";
  position: absolute;
  display: inline-block;
  width: 36px;
  height: 36px;
  top: -7px;
  left: -37px;
  border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
}

.new-radio-buttons .custom-radio .custom-control-label::before {
  background-color: #D8D8D8;
  box-shadow: inset 0px -2px 0px #B9B9B9;
}

.new-radio-buttons .custom-radio .custom-control-label::after {
  background: none !important;
  background-image: none !important;
}

.new-radio-buttons .custom-radio .custom-control-input:checked~.custom-control-label::before {
  background-color: #2696F1;
  box-shadow: inset 0px -2px 0px #0B67D9;
}

.new-radio-buttons .custom-radio .custom-control-input:checked~.custom-control-label::after {
  font-family: "Font Awesome 5 Free";
  font-size: 15px;
  font-weight: 900;
  content: "\f00c";
  color: white;
  text-align: center;
  margin-top: 8px;
}

/* spinbuttons new style */
.spin-buttons button {
  background-color: #F2F2F2 !important;
  color: #737373 !important;
}

.spin-buttons output {
  font-size: 14px;
  line-height: 16px;
  font-weight: 300;
  padding: .25rem !important;
  margin: 0 !important;
  color: #737373 !important;
}

.spin-buttons output bdi {
  margin-top: 10px;
  margin-bottom: 10px;
  height: auto !important;
  width: 100%;
  min-width: 100%;
}

.w-fit {
  width: fit-content;
}
#modal-form-trunks{
  z-index: 10100 !important;
}
#modal-form-trunks .modal-content {
  height: 100%;
  max-height: inherit;
}

#modal-form-trunks .modal-dialog {
  margin: 0;
  max-height: inherit;
} 
#modal-form-trunks .modal-body{
  padding: 0 !important
}