body {
  font-family: Overpass, open_sansregular, HelveticaNeue, "Helvetica Neue",
    Helvetica, Arial, sans-serif !important;
  background-color: #fff;
  color: var(--bs-gray-dark) !important;
  height: 100% !important;
}
h3 {
  margin-bottom: 20px !important;
}

h5.modal-title {
  padding: 0 !important;
}

.w-30 {
  width: 30% !important;
}
.h100 {
  height: calc(100vh - 100px) !important;
}
.sidebar-h100 {
  height: calc(100vh - 100px) !important;
}

.nobar-h100 {
  min-height: calc(80vh);
}

.table-h100 {
  min-height: calc(100vh - 325px);
}

.paginated-table-h100 {
  height: calc(100vh - 365px);
}
.content-h100 {
  height: calc(100vh - 166px) !important;
}

#topmenubar {
  width: 100% !important;
  height: 66px !important;
  overflow-x: scroll !important;
}
.topmenu-bar .nav {
  flex-wrap: nowrap !important;
}

#sidebar .left-icon {
  position: absolute;
  left: 25px;
}

.table-actions-td {
  padding-top: 5px !important;
  padding-bottom: 2px !important;
  text-align: right;
}

.table-actions-th {
  text-align: right;
}

.x-button {
  height: 38px !important;
}

.sm-drop-down ul {
  min-width: 70px !important;
  max-width: 70px !important;
}

/* start search form */

#log-search-form label {
  white-space: nowrap;
}
.account-form-input {
  width: 100px !important;
}
.log-list-form-input {
  min-width: 40px !important;
  max-width: 100px !important;
}
.log-text-form-input {
  min-width: 60px !important;
  max-width: 140px !important;
}
.name-form-input {
  width: 160px !important;
}
.id-form-input {
  width: 80px !important;
}
.code-form-input {
  min-width: 60px !important;
  max-width: 90px !important;
}
.filter-form-input {
  margin-top: 33px !important;
  height: 36px;
}
.page-form-input {
  min-width: 80px !important;
  max-width: 80px !important;
}
.inline-label-text {
  padding-top: 6px !important;
  margin-right: 6px !important;
}
@media screen and (min-width: 575px) {
  .button-form-input {
    margin-top: 33px !important;
  }
}
/* end search form */

/* start Park */

.tools button {
  margin-left: 4px;
}

.park-card {
  margin: 0 20px 20px 0;
  min-height: 320px;
}

/* end Park */

/* Start Overpass fix */
.btn {
  padding-top: 6px !important;
  padding-bottom: 4px !important;
}

.alert {
  padding-top: 16px;
}

.dropdown-menu li span,
.dropdown-menu li a {
  padding-top: 8px !important;
}

.table td {
  margin-bottom: 6px !important;
}

.table th {
  padding-top: 14px;
}

.table-index th {
  padding-top: 8px;
}

h5 {
  padding-top: 8px;
}

input,
select {
  padding-bottom: 4px !important;
}

a {
  padding-top: 11px !important;
  padding-bottom: 7px !important;
}

.b-calendar-grid-body span,
.b-form-datepicker label {
  padding-top: 10px !important;
}

/* End Overpass fix */

#sidebar .nav-item {
  padding: 0px;
}
#sidebar .nav-link {
  padding: 16px 0px 14px 0px !important;
}

#sidebar .router-link-exact-active::before {
  content: "";
  position: absolute;
  left: 230px;
  display: block;
  border-top: 0px solid transparent;
  border-right: 0px solid transparent;
  border-left: 10px solid var(--light);
  border-bottom: 10px solid var(--light);
  width: 10px;
  height: 10px;
  transform: translate(-5px, 6px) rotate(45deg);
}
@media screen and (min-width: 575px) {
  /*mode desktop*/
  .side-bar {
    min-width: 230px !important;
    min-height: calc(100vh - 100px);
  }
  .toggle-wrap {
    display: flex;
    flex-wrap: nowrap !important;
    flex-direction: row !important;
    min-height: unset !important;
  }

  .park-card {
    width: 320px;
  }

  .right-icon {
    float: right;
    position: absolute;
    left: 180px;
  }
  #topmenubar {
    display: none;
  }
  .lock-status > div {
    display: flex !important;
  }
}

@media screen and (max-width: 575px) {
  /* mode telephone */

  .side-bar {
    display: none;
  }
  .toggle-wrap {
    display: block;
    flex-wrap: wrap !important;
    flex-direction: column !important;
  }
  .park-card {
    width: 100% !important;
    margin-right: 0;
  }

  .right-icon {
    float: right;
    position: absolute;
    right: 20px;
  }
  .navbar-light::before {
    content: "" !important;
    top: 40px;
  }
}

.lock-status {
  display: flex;
  flex-wrap: wrap !important;
  flex-direction: row !important;
  justify-content: space-between;
}

.lock-status .b-icon {
  font-size: 20px;
}
.rack-status-modal,
.modal-content {
  border-top-left-radius: 20px !important;
  border-top-right-radius: 20px !important;
  border-radius: 20px !important;
}

.rack-status-modal .modal-body {
  padding: 0;
}

.rack-status > div,
.rack-status .footer {
  padding: 6px 12px 6px 12px;
  font-size: 18px;
}

.rack-status .header {
  padding: 12px;
  font-size: 18px;
  margin-bottom: 8px;
  font-weight: 800;
}

.rack-status .overdue {
  color: darkorange;
}

.rack-status .rfid-overdue {
  color: purple;
}

.rack-status .intime {
  color: blue;
}

.rack-status .footer {
  padding: 10px;
  text-align: center;
}
.rack-status .footer button,
.modal-footer button {
  border-radius: 20px;
  margin: 10px 10px;
}

.navbar,
.topnav {
  height: 100px;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.logo {
  width: 230px !important;
  height: 100px;
}

#nav-collapse {
  z-index: 1001 !important;
}

.navbar-toggler {
  margin-right: 15px !important;
}
.navbar-light .navbar-nav .nav-link {
  color: unset !important;
}

a.card-park-link,
a.card-park-link:hover {
  color: inherit;
  text-decoration: inherit;
}

#log-table tr:nth-child(even),
#journal-modal tr:nth-child(odd),
.stripped tr:nth-child(even) {
  background-color: #f2f2f2;
}
#log-table td,
#journal-modal td,
#journal-modal th {
  padding: 10px 10px 4px 10px;
}

#log-table td,
#journal-table td {
  padding: 11px 10px 5px 10px;
}

.journal-action {
  white-space: nowrap;
  border-radius: 3px;
  padding: 5px 10px 2px 8px !important;
}
.journal-action.action-buy {
  background-color: rgb(110, 179, 110);
  color: var(--light);
}
.journal-action.action-detach {
  background-color: rgb(116, 178, 230);
  color: var(--light);
}

.journal-action.action-attach {
  background-color: rgb(228, 177, 67);
  color: var(--light);
}
.journal-status-error {
  white-space: nowrap;
  background-color: rgb(196, 94, 94);
  color: var(--light);
  border-radius: 3px;
  padding: 5px 10px 2px 8px !important;
}
.success-check {
  font-size: 22px;
}

.contact-type {
  font-size: 24px;
}

.navbar-light::before {
  content: "parcs à vélos";
  position: absolute;
  transform: translate(280px, 0px);
  color: dark;
  letter-spacing: 10px;
  text-transform: uppercase;
  font-weight: bold;
  font-size: large;
}
.test {
  color: #146aa3a9;
}

.stats-content {
  padding: 15px;
}

.stats-content td {
  border: solid 1px #969696;
  padding: 11px 10px 10px 10px;
  color: var(--dark);
}

.occupancy-content td,
.occupancy-content th {
  padding: 11px 10px 10px 10px;
  text-align: center;
}

/* alerts */
.alerts-title {
  font-size: 17px;
  white-space: nowrap;
}

#rfid-status,
#gateway-status,
#failures-status {
  border: solid 1px red;
  border-radius: 5px;
  border-left-width: 5px;
  padding: 15px;
  color: #333;
  margin-top: 15px;
}
#gateway-status .error-status,
#rfid-status .error-status,
#failures-status .error-status {
  font-size: 14px;
  color: white;
  background-color: rgb(214, 75, 75);
  padding: 6px 6px 3px 6px;
  white-space: nowrap;
  border-radius: 3px;
}

#rfid-status .info-status,
#gateway-status .info-status {
  font-size: 14px;
  color: white;
  background-color: grey;
  white-space: nowrap;
  padding: 6px 6px 3px 6px;
  border-radius: 3px;
}

#planted-status {
  border: solid 1px rgb(235, 192, 53);
  border-radius: 5px;
  border-left-width: 5px;
  padding: 15px;
  color: #333;
  margin-top: 15px;
}

#planted-status .warning-status {
  font-size: 14px;
  color: white;
  background-color: rgb(235, 192, 53);
  padding: 6px 6px 3px 6px;
  white-space: nowrap;
  border-radius: 3px;
}

.alerts-warning-icon {
  font-size: 28px;
  color: rgb(235, 192, 53);
  margin-top: -5px;
  cursor: pointer;
}
.alerts-error-icon {
  font-size: 28px;
  color: red;
  margin-top: -5px;
  cursor: pointer;
}

/* Start TK //TODO include by account */

.side-bar-tk,
.side-bar-arceau {
  background-color: #008daa;
  color: var(--light);
}
.side-bar-tk a,
.side-bar-arceau a {
  color: var(--light);
  margin-top: 0px;
  margin-bottom: 0px;
}
.side-bar-tk a:hover,
.side-bar-tk .router-link-exact-active,
.side-bar-arceau a:hover,
.side-bar-arceau .router-link-exact-active {
  color: var(--white);
  background-color: #39435f;
}

.side-bar-tk #params-menu {
  background-color: #007f99;
}

.rack-status-tk .header,
.rack-status-arceau .header {
  background-color: grey;
  color: var(--light);
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
}

.body-,
.body-tk,
.body-arceau {
  background: linear-gradient(
    to right,
    white 0%,
    white 50%,
    #000000 50%,
    #39435f 50%,
    #39435f 100%
  );
}
.loginbar-,
.loginbar-tk,
.loginbar-arceau {
  height: 20vh;
  background: linear-gradient(
    to right,
    white 0%,
    white 50%,
    #000000 50%,
    #39435f 50%,
    #39435f 100%
  );
}
.logo-tk {
  height: 20vh;
  max-width: 45%;
  background-image: url(/img/tk/logo.png);
  background-repeat: no-repeat;
  background-position-x: right;
  background-position-y: bottom;
  background-size: auto;
}
.logo-,
.logo-arceau {
  height: 20vh;
  max-width: 45%;
  background-image: url(/img/tk/logo-ns.png);
  background-repeat: no-repeat;
  background-position-x: right;
  background-position-y: bottom;
  background-size: contain;
}

.xrack-status-lpa {
  border: 0;
}
.rack-status-arceau .header,
.rack-status-tk .header,
.modal-header-arceau,
.modal-header-tk {
  background-color: #008daa;
  color: var(--light);
  border-top-left-radius: 12px !important;
  border-top-right-radius: 12px !important;
  padding-bottom: 8px !important;
}

.topnav-tk,
.topnav-tk .navbar-nav,
.topnav-arceau,
.topnav-arceau .navbar-nav {
  background-color: #39435f;
  color: var(--light) !important;
}
.topnav-tk a.navlink,
.topnav-arceau a.navlink {
  color: var(--light) !important;
}

.topnav-arceau .logo {
  background-image: url(/img/arceau/logo-ns.png);
  background-size: 210px;
  background-repeat: no-repeat;
  background-color: white;
}

.topnav-tk .logo {
  background-image: url(/img/tk/logo.png);
  background-size: 210px;
  background-repeat: no-repeat;
  background-color: white;
  background-position-x: center;
  background-position-y: center;
}

.topnav-tk .navbar-toggler,
.topnav-arceau .navbar-toggler {
  background-color: #2eb4cf;
}

.topnav-tk .top-search-button,
.topnav-tk .top-search-button:focus,
.topnav-arceau .top-search-button,
.topnav-arceau .top-search-button:focus {
  background-color: #008daa;
  border-color: #39435f;
  color: var(--light);
  outline: 0;
}

.topnav-tk .top-search-input,
.topnav-tk .top-search-input:focus,
.topnav-arceau .top-search-input,
.topnav-arceau .top-search-input:focus {
  border-color: #39435f;
  background-color: #2eb4cf;
  color: var(--light) !important;
  outline: 0;
}

.topnav-tk .top-search-input::placeholder,
.topnav-arceau .top-search-input::placeholder {
  color: var(--light) !important;
}

.body-tk .login-form,
.body-arceau .login-form {
  background-color: #008daa;
  color: var(--light);
}
.body-tk .login-form button,
.body-arceau .login-form button {
  background-color: #39435f;
  color: var(--light);
}
/* End TK */

/* LPA */

.side-bar-lpa {
  background-color: grey;
  color: var(--light);
}
.side-bar-lpa a {
  color: var(--light);
}
.side-bar-lpa a:hover,
.side-bar-lpa .router-link-exact-active {
  color: var(--light);
  background-color: rgb(102, 102, 102);
}

.side-bar-lpa #params-menu {
  background-color: rgb(116, 116, 116);
}

.body-lpa {
  background: linear-gradient(
    to right,
    white 0%,
    white 50%,
    #000000 50%,
    grey 50%,
    grey 100%
  );
}
.loginbar-lpa {
  height: 20vh;
  background: linear-gradient(
    to right,
    white 0%,
    white 50%,
    #000000 50%,
    grey 50%,
    grey 100%
  );
}

.body-lpa .login-form {
  background-color: #ffed00;
}
.body-lpa .login-form button {
  background-color: grey;
  color: var(--light);
}
.logo-lpa {
  height: 20vh;
  max-width: 48%;
  background-image: url(/img/lpa/lpa-nav-logo.png);
  background-repeat: no-repeat;
  background-position-x: right;
  background-position-y: bottom;
  background-size: 180px;
}
.rack-status-lpa {
  border: 0;
}
.rack-status-lpa .header,
.modal-header-lpa {
  background-color: grey;
  color: #ffed00;
  border-top-left-radius: 12px !important;
  border-top-right-radius: 12px !important;
  padding-bottom: 8px !important;
}
.topnav-lpa {
  border-bottom: solid 1px grey !important;
}

.topnav-lpa,
.topnav-lpa .navbar-nav {
  color: grey;
  background-color: #ffed00;
}
.topnav-lpa a {
  color: grey;
}

.topnav-lpa .logo {
  background-image: url(/img/lpa/lpa-nav-logo.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-color: white;
  border-right: solid 1px grey !important;
  border-bottom: solid 1px grey !important;
  background-position: center;
}

.topnav-lpa .top-search-button {
  background-color: grey;
  color: #ffed00;
}

.topnav-lpa .top-search-input,
.topnav-lpa .top-search-input:focus {
  border-color: grey;
  background-color: grey;
  color: var(--light) !important;
  outline: 0;
}

.topnav-lpa .top-search-input::placeholder {
  color: var(--light) !important;
}

/* /LPA */

/* start leaflet */
.leaflet-map {
  height: calc(100vh - 250px) !important;
  background: var(--light) !important;
  border: solid 1px #aaa;
}
.leaflet-bar a,
.leaflet-bar a:hover {
  padding-top: unset !important;
}

.custom-control-watermark {
  color: var(--gray);
  font-size: 18px;
}

.leaflet-popup-content {
  margin: 0 !important;
  min-width: 380px;
}
.leaflet-container a.leaflet-popup-close-button {
  padding: 10px !important;
  margin: 6px 16px !important;
}
.leaflet-container {
  _font: unset !important;
}
.leaflet-control {
  z-index: 100 !important;
}
.dropdown-menu {
  z-index: 1001 !important;
}
.l-tooltip {
  font-size: 16px;
  font-weight: 400;
}

/* end leaflet */

@media print {
  header {
    display: none;
  }
  footer {
    display: none;
  }
}