/*
* O CSS abaixo vem do repositório whmcs-snippet-library
* Arquivo: /src/templates/twenty-one-child/css/custom.css
*/
/* Afeta a seguinta página: /clientarea.php?action=details */
.clientDetailsLoadingEffect {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #ffffffbb;
  display: none;
  /* é definido para flex, dinamicamente */
  justify-content: center;
  align-items: center;
  z-index: 9;
  border-radius: 3px;
  transition: all 0.2s ease-in-out;
}

.clientDetailsLoadingEffect>div {
  margin-right: 15px;
}

.clientDetailsLoadingEffect>span {
  font-weight: bold;
}

.iti>input {
  padding-left: 91.45px !important;
}

/* Fim whmcs-snippet-library */

.sidebar .list-group-item.active:hover {
  color: #fff !important;
}

#order-standard_cart .products .product header {
  background: #f4f4f4 !important;
}

.product-desc div {
  margin-bottom: 7px;
}

#order-standard_cart .products .product {
  background-color: #f4f4f4 !important;
}

.primary-bg-color {
  background-color: #fff;
  /*#e9ecef*/
}

a:hover {
  text-decoration: none;
  color: #0C71C3 !important;
}

.btn-success:hover {
  color: #fff !important;
}

.form-check-input {
  position: relative;
}

.form-check {
  font-size: 20px !important;
}

.extra-settings-container .form-check {
  font-size: initial !important;
}

.footer-child {
  padding: 10px 0 0px;
  color: #ccc;
  background-color: #000101;
  margin-top: 50px;
}

.footer-child button.btn {
  color: #ccc;
}

.copyright-child {
  font-size: 10px;
  text-align: center;
}

.list-inline.text-center.float-lg {
  margin-bottom: 0px;
}

#mainNavbar {
  padding: 0.5rem 0rem 0.5rem 0rem;
  /*0.5rem 1rem 0.5rem 0rem;*/
  background-color: #fff;
}

ul#nav {
  margin: 0px 0 22px 0;
}

li#Primary_Navbar-Open_Ticket a {
  background-color: #FF0D08;
  text-align: center;
  padding: 7px 25px;
  color: #fff;
  border-radius: 5px;
}

li#Primary_Navbar-Open_Ticket a:hover {
  color: #fff !important;
  background-color: #1e3141;

}

li#Secondary_Navbar-Account {
  margin-bottom: 15px;
  border-top: none;
  margin-top: -10px;
}

li#Secondary_Navbar-Account>a {
  background-color: #f0f4f7;
  padding: 10px;
  border-radius: 5px;
}

#header,
.header {
  background-color: #fff;
  /*#e9ecef;*/
  margin-bottom: 25px;
}

.breadcrumb,
.master-breadcrumb {
  background-color: #fff;
}

.breadcrumb-item a,
.breadcrumb-item.active {
  font-size: 10px;
}

.master-breadcrumb .breadcrumb {
  padding: 0;
  margin-left: -14px;
}

.header .toolbar .nav-link {
  background-color: #fff;
}

.header .navbar-nav a {
  font-size: 14px;
  color: #787878;
}

.header .main-navbar-wrapper {
  background-color: #fff;
  box-shadow: 0px 20px 50px -19px #f0f4f7;
}

.navbar {
  padding: 30px 0 30px 0
}

.breadcrumb-item+.breadcrumb-item::before {
  content: "";
}

.tiles .tile {
  background-color: #fff;
}

.tiles .tile:hover {
  background-color: #fcf7f5;
}

.tiles .tile i {
  font-size: 30px;
}

.tiles .tile:hover i {
  font-size: 40px;
  color: #FF0D08;
}

.tile>.highlight {
  display: none;
}

.tiles .tile i {
  color: #f0f4f7;
}

.card-accent-gold,
.card-accent-red,
.card-accent-midnight-blue,
.card-accent-teal,
.card-accent-emerald,
.card-accent-blue {
  border: 3px solid #ffffff;
  box-shadow: 0px 0px 8px 7px #f0f4f7;
}


div[menuitemname='Client Details'] {
  font-size: 13px;
  background-color: #0C71C3;
  color: #fff;
}

div[menuitemname='Client Details'] .card-header {
  display: none;
}

div[menuitemname='Client Details'] .card-header {
  display: none;
}

div[menuitemname='Client Details']>div>.card-body strong {
  font-weight: 100;
  font-size: 20px;
}

div[menuitemname='Client Details'] .card-footer {
  border-top: none;
}

.card-body .badge-danger {
  position: absolute;
  font-size: 10px;
  padding: 3px 5px;
  border-radius: 50%;
}

.card-footer {
  background-color: rgb(0 0 0 / 0%);
}

.client-home-cards .card-body {
  max-height: fit-content;
}

/* =========== TOOLTIP PLANS ========== */

#tooltip {
  position: relative;
}

.qcard-text {
  font-size: small;
  padding-left: 1em;
}

#tooltip::before {
  border-radius: 100%;
  position: absolute;
  background: #666;
  bottom: 6px;
  height: 5px;
  content: '';
  width: 5px;
  left: 0%;

}

#tooltiptext {
  display: inline;
  font-size: 11px;
  visibility: hidden;
  width: 60%;
  background-color: #3d8dcf;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 5px;
  position: absolute;
  left: 0;
  right: 0;
  z-index: 1;
  bottom: 125%;
  opacity: 0;
  transition: opacity 0.3s;
}

@media screen and (max-width: 599px) {
  #tooltiptext {
    width: 80%;
  }

  #nav li {
    padding: 10px;
    border: 2px solid #fff;
    background-color: #f0f4f7;
  }

  #mainNavbar {
    background-color: #fff;
    border: 1px solid #fff;
    border-radius: 5px;
    margin-left: 15px;
    margin-right: 15px;
  }

  /* =========== TABELA MOBILE ========== */
  #tableInvoicesList td.sorting_2,
  #tableInvoicesList th.sorting_asc,
  #tableInvoicesList th.sorting:nth-child(2),
  #tableInvoicesList td:nth-child(2),
  #tableServicesList th:nth-child(3),
  #tableServicesList th:nth-child(4),
  #tableServicesList td:nth-child(3),
  #tableServicesList td:nth-child(4),
  #tableDomainsList th:nth-child(2),
  #tableDomainsList th:nth-child(4),
  #tableDomainsList th:nth-child(5),
  #tableDomainsList td:nth-child(2),
  #tableDomainsList td:nth-child(4),
  #tableDomainsList td:nth-child(5),
  #tableQuotesList th:nth-child(3),
  #tableQuotesList th:nth-child(4),
  #tableQuotesList th:nth-child(6),
  #tableQuotesList td:nth-child(3),
  #tableQuotesList td:nth-child(4),
  #tableQuotesList td:nth-child(6) {
    display: none;
  }

  .dataTables_wrapper .dataTables_paginate {
    float: none !important;
    margin-bottom: 10px !important;
  }

  /* =========== TABELA MOBILE  FIM ========== */
}

#tooltiptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #3d8dcf transparent transparent transparent;
}

#tooltip:hover #tooltiptext {
  visibility: visible;
  opacity: 1;
}