html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

:root {
  --hops-ink: #1f2a1f;
  --hops-ink-soft: #3c4a3c;
  --hops-cream: #f7f3ea;
  --hops-sand: #efe8d8;
  --hops-leaf: #2f6d3a;
  --hops-leaf-dark: #25582f;
  --hops-gold: #d9a441;
  --hops-rust: #b86b2a;
  --hops-border: #d8d1c1;
  --hops-shadow: 0 12px 30px rgba(33, 43, 33, 0.12);
  --hops-shadow-soft: 0 6px 18px rgba(33, 43, 33, 0.08);
  --hops-radius: 14px;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.15rem #fff, 0 0 0 0.35rem rgba(47, 109, 58, 0.35);
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
  font-family: "Candara", "Optima", "Palatino Linotype", "Book Antiqua", serif;
  color: var(--hops-ink);
  background:
    radial-gradient(1200px 600px at 10% -10%, #fff7e5 0%, rgba(255, 247, 229, 0) 60%),
    radial-gradient(900px 500px at 90% 10%, #e3f0e5 0%, rgba(227, 240, 229, 0) 55%),
    linear-gradient(180deg, var(--hops-cream) 0%, #f2eee4 100%);
}

h1, h2, h3, h4, h5, h6 {
  color: var(--hops-ink);
  letter-spacing: 0.2px;
}

a {
  color: var(--hops-leaf);
}

a:hover {
  color: var(--hops-leaf-dark);
}

.container,
.container-fluid {
  border-radius: var(--hops-radius);
}

.row > .col-12,
.row > [class*="col-"] {
  transition: transform 0.2s ease;
}

.table {
  background-color: #fff;
  border-radius: var(--hops-radius);
  overflow: hidden;
  box-shadow: var(--hops-shadow-soft);
}

.table thead th {
  background-color: var(--hops-sand);
  color: var(--hops-ink);
  border-bottom: 1px solid var(--hops-border);
}

.table tbody tr:hover {
  background-color: #f8f5ec;
}

.form-control,
.form-select,
.form-check-input {
  border-radius: 10px;
  border-color: var(--hops-border);
  background-color: #fffdf7;
}

.form-control:focus,
.form-select:focus {
  border-color: var(--hops-leaf);
}

.btn {
  border-radius: 999px;
  box-shadow: var(--hops-shadow-soft);
  transition: transform 0.12s ease, box-shadow 0.12s ease;
}

.btn:hover {
  transform: translateY(-1px);
  box-shadow: var(--hops-shadow);
}

#alertRow {
    z-index: 200;
    position: absolute;
    min-width: 100% !important;
    left: 0%;
    top: 0%;
}
.modal-header {
    max-height: 30px !important;
    background-color: var(--hops-leaf);
    color: white;
    font-size: small
}

.modal-header .modal-title,
.modal-header h1, .modal-header h2, .modal-header h3,
.modal-header h4, .modal-header h5, .modal-header h6 {
    color: white;
}

.modal-header .btn-close {
    filter: invert(1);
}

.btn-primary {
    background-color: var(--hops-leaf);
    color: white;
    border-color: var(--hops-leaf-dark);
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: var(--hops-leaf-dark);
    border-color: var(--hops-leaf-dark);
}

.btnXs {
    font-size: 0.8em;
    padding-top: 0;
    padding-bottom: 0;
}


.loading-state {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3);
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
}

.loading {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    border: 10px solid #ddd;
    border-top-color: orange;
    /*animation: loading 1s linear infinite;*/
    animation-name: spin;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
/*header {
    background-image: url('../images/hopsheaderbacksmaller.png');
    background-size:cover;

}*/
.footer {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    height:50px;
    text-align: center;
    background: linear-gradient(90deg, rgba(47, 109, 58, 0.08), rgba(217, 164, 65, 0.08));
    border-top: 1px solid var(--hops-border);
}
@media print {

    @page {
        size: auto;
        margin-top: 10px;
        margin-bottom: 10px;


    }
    #Certificate {
        margin-left: 60px;
        margin-right: 60PX;
    }
    .HideMePrint {
        display: none;
    }
    body {
        background: #fff !important;
    }
    .sig-img {
        mix-blend-mode: multiply;
    }
}

/* Remove number input spinners */
.no-spinner::-webkit-inner-spin-button,
.no-spinner::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.no-spinner {
    -moz-appearance: textfield;
}