/********* PAYPAL radio buttons cards **********/

.card-input:hover {
  cursor: pointer;
  box-shadow: 0 0 1px 1px #6ca10f;
}

.card-input-element:checked + .card-input {
   box-shadow: 0 0 1px 1px #6ca10f;
}


.radio-custom {
  /* Add if not using autoprefixer */
  -webkit-appearance: none;
  /* Remove most all native input styles */
  -moz-appearance: none;
       appearance: none;
  /* For iOS < 15 */
  background-color: var(--form-background);
  /* Not removed via appearance */
  margin: 0;
  font: inherit;
  color: currentColor;
  width: 2.15em;
  height: 2.15em;
  border: 0.15em solid currentColor;
  border-radius: 50%;
  /* transform: translateY(-0.075em); */
  display: grid;
  place-content: center;
  color: #6ca10f;
}

.radio-custom::before {
  content: "";
  width: 1.25em;

  height: 1.25em;
  border-radius: 50%;
  transform: scale(0);
  transition: 120ms transform ease-in-out;
  box-shadow: inset 1em 1em #6ca10f;
  /* Windows High Contrast Mode */
  background-color: CanvasText;
}

.radio-custom:checked::before {
  transform: scale(1);
  color: #6ca10f;
}

.radio-custom:focus {
  outline: max(2px, 0.15em) solid currentColor;
  /* outline-offset: max(2px, 0.15em); */
}

.radio-custom:invalid {
  outline: max(2px, 0.15em) solid currentColor;
  outline-offset: max(2px, 0.15em);
}



/********* glow **********/
.card-glow {
  border-color: #6ca10f;
  /* box-shadow: 0px 0px 8px 1px rgba(0, 168, 161, 0.4); */
}
.card-history {
  background-color:#f8f8f8;
}
.card-history:hover {
  background-color:#eeeeee;
}
.ca-history-is-shared {
  background-repeat: no-repeat;
  background-position: right;

}

/* login agb */
.tac{
  color:#6ca10f;
}

.tac:hover {
  cursor:pointer;
  color:#76a12b;
 }

/********* NAVIGATION BAR **********/
.ca-navbar{
  z-index:1000;
  /* opacity: 0.9; */
  border-bottom: 4px solid #6ca10f;
}
.bg-corono-light{
  background-color: rgb(0, 168, 161, 0.3) !important;
  border-radius: 4px;
}

@media only screen and (min-width: 768px) {
  .navbar .navbar-nav .nav-item:not(:last-child) .nav-link {
    border-right: 1px solid rgba(0, 0, 0, 0.1);
  }
}
.navbar .navbar-nav .nav-item:hover{
  background-color: rgba(0, 0, 0, 0.1) !important;
}

.bg-corono{
  background-color: #6ca10f !important;
}
.text-corono{
  color: #6ca10f !important;
}
.text-corono-dark{
  color: #2e2e2e !important;
}

.wait-minutes-corono{
  font-size: 300%; 
}

.spinner-corono {
  font-size: 150%; 
  color: #6ca10f !important;
}
.corono-menu-button {
  font-size: 140%; 
}

.qr-code {
  font-size: 150%; 
}
/********* test result background **********/

.bg-negative {
  background-color: rgba(155, 206, 199, 0.50);
}

.bg-positive {
  background-color: rgba(226, 199, 199, 0.50);
}

.bg-corono-info {
  background-color: rgba(255, 243, 205, 0.50);
}

/********* Buttons **********/

/* Primary Buttons */
.btn:focus {
  box-shadow: none;
}
.btn-primary, .btn-primary:active, .btn-primary:visited {
  background-color: #6ca10f !important;
  border: None !important;
  box-shadow: none;
}
.btn-primary:hover{
  background-color: #6ca10f !important;
  border-color: #6ca10f !important;
  border: None !important;
  box-shadow: none !important;
}

/* Outline Primary Buttons */
.btn-outline-primary, .btn-outline-primary:visited {
  background-color: #FFFFFF !important;
  border-color: #6ca10f !important;
  box-shadow: none;
  color: #000000;
}

.btn-outline-primary:active {
  background-color: #6ca10f !important;
  border-color: #6ca10f !important;
  box-shadow: none;
  color: #F00;
}

.btn-outline-primary:hover{
  color: #000000;
  background-color: #6ca10f80 !important;
}
/* checkbox buttons */
input[type="radio"]:checked + .btn {
  color: #fff;
  box-shadow: none;
  background: #6ca10f!important;
}


/********* Pagination Color **********/
.page-item.active .page-link {
  z-index: 1;
  color: #fff;
  background-color: #6ca10f;
  border-color: #6ca10f;
}

.page-link {
  color: #6ca10f;
}

/********* Form Switch **********/
.form-switch .form-check-input:checked {
  background-color: #6ca10f;
  border-color: rgb(0, 148, 141);
  border: none;
}

/********* Progress Bar available tests **********/
.progress-bar-available-tests-green{
  background-color: #6ca10f;
}

.progress-bar-available-tests-yellow{
  background-color: #F5A118;
}

.progress-bar-available-tests-red{
  background-color: #F52418;
}

/* Checkboxes */
.red-input {
  accent-color: #6ca10f;
  height: 24px; /* not needed */
  width: 24px; /* not needed */
}

/********* missing data boxes **********/
.add-box-missing-data-inner {
  background-color: #EEEEEE;
  border-color: #BBBBBB;
  border-style: dashed;
  border-width: 4px;
  border-radius: 4px;
  padding:10px;
  color: #444444;

}

.add-box-missing-data-inner:hover {
  color: #000000;
}

.add-box-missing-data{
  padding: 20px;
  text-decoration: none;
  color: inherit;
}

/********* Sections **********/
.header-image {
  background-image: url("/static/images/base/entry_bg_00.jpg");
  background-size: cover;
  position: center;
}

.text-bg {
  background-color :#b94a48;
}

.back {
  width: 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  left:0;
}

.div-center {
  width: 400px;
  min-height: 400px;
  background-color: rgba(255,255,255,.9);
  position: absolute;
  left: 0;
  right: 0;
  top: 80px;
  bottom: 0;
  margin: auto;
  max-width: 100%;
  max-height: 100%;
  overflow: auto;
  padding: 1em 2em;
  border-bottom: 12px solid #6ca10f;
  display: table;
}

div.content {
  display: table-cell;
  vertical-align: middle;
}

hr.dashed {
  background-color: white;
	border-top: 1px dashed #8c8b8b;
  margin: 10px 0px;
}

hr.solid {
	border-top: 1px solid #8c8b8b;
  margin: 10px 0px;
}

/********* Coockiecutter **********/
/* These styles are generated from project.scss. */

.alert-debug {
  color: black;
  background-color: white;
  border-color: #d6e9c6;
}

.alert-error {
  color: #b94a48;
  background-color: #f2dede;
  border-color: #eed3d7;
}

.radio-toolbar input[type="radio"] {
  opacity: 0;
  position: fixed;
  width: 0;
}

.radio-toolbar label {
    display: inline-block;
    background-color: #FFFFFF;
    padding: 10px 20px;
    font-family: sans-serif, Arial;
    font-size: 16px;
    border: 3px dashed #444;
    border-radius: 4px;
}

.radio-toolbar label:hover {
  background-color: #6ca10f;
}

.radio-toolbar input[type="radio"]:focus + label {
    border: solid 3px #444;
}

.radio-toolbar input[type="radio"]:checked + label {
    background-color: #6ca10f;
    border-color: #444;
    border: solid 3px #444;
}