:root {
  --bs-link-color: #212529;
  --bs-link-color-rgb: 33, 37, 41;
  --bs-link-decoration: none;
  --bs-link-hover-color: #000;
  --bs-link-hover-color-rgb: 0, 0, 0;
  --bs-body-bg: #f6f6f6;
  --bs-body-bg-rgb: 246, 246, 246;
  --bs-body-font-family: "Poppins", sans-serif;
}

.nav-pills {
  --bs-nav-pills-border-radius: 0;
  --bs-nav-pills-link-active-bg: #000;
}

.nav-tabs {
  --bs-nav-tabs-border-radius: 0 ;
}

.pagination {
  --bs-pagination-bg: #fff;
  --bs-pagination-active-bg: #000;
  --bs-pagination-active-border-color: #000;
}

.input-group .form-control,
.input-group .input-group-text {
  padding: 0.25rem 0.5rem;
  background-color: #fff;
}
.input-group .btn {
  --bs-btn-padding-x: 0.4rem;
  --bs-btn-padding-y: 0.2rem;
  --bs-btn-border-radius: 0;
  --bs-btn-bg: #fff;
}

.form-control:focus {
  box-shadow: unset;
}

.form-check-input:focus {
  box-shadow: unset;
}
.form-check-input:checked {
  background-color: var(--bs-success);
  border-color: var(--bs-success);
}

.card {
  --bs-card-bg: #fff;
}

.table {
  --bs-table-bg: #fff;
}

.text-bg-white {
  background-color: #fff;
}

.navbar-logo {
  height: 48px;
}

.logo {
  font: 700 2.25rem Poppins, sans-serif;
}
.logo img {
  height: 128px;
}

.form-boxed {
  min-height: 100vh;
  display: flex;
  align-items: center;
  flex-direction: column;
  background: #fff url(../img/bg-eyeglasses.jpg) no-repeat 0 0/cover;
}
.form-boxed form {
  max-width: 480px;
}
.form-boxed form fieldset {
  background: #fff;
  border-radius: var(--bs-border-radius-xl);
  border: 1px solid var(--bs-gray-500);
  font-family: "Plus Jakarta Sans";
}
.form-boxed form fieldset legend {
  font-weight: 600;
  font-size: 2rem;
}
.form-boxed form fieldset a {
  color: var(--bs-gray-600);
  text-decoration: none;
}
.form-boxed form.register {
  max-width: 640px;
}

th a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  text-decoration: none;
  color: inherit;
}

td.view_more, td.action, td.w-0 {
  width: 0;
  white-space: nowrap;
}
td.view_more .btn {
  display: flex;
  --bs-btn-border-radius: 0;
}

.thumbnails img {
  height: 36px;
  width: auto;
  object-fit: contain;
}

.toggle {
  text-decoration: none;
  padding: 0.35em 0.65em;
  white-space: nowrap;
  font-size: 0.85em;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.form-label.required::after {
  content: "*";
  font: 1.25em monospace;
  color: var(--bs-red);
  display: inline-flex;
  text-indent: 5px;
}

#list-tab-pane:not(.empty) {
  margin-top: -3rem;
}

.products .grid {
  display: grid;
  grid-template-columns: 1;
  font-family: "Poppins", sans-serif;
}
.products .grid .grid-row {
  display: grid;
  grid-template-columns: 1fr 1fr repeat(4, minmax(0, 160px));
  align-items: center;
}
.products .grid .grid-row.grid-col-5 {
  grid-template-columns: 1fr 1fr repeat(3, minmax(0, 160px));
}
.products .grid .grid-row.grid-col-4 {
  grid-template-columns: 1fr 1fr repeat(2, minmax(0, 160px));
}
.products .grid .grid-row:not(.header) {
  background: #fff;
  border-radius: 10px;
}
.products .grid .grid-row .description h4,
.products .grid .grid-row .description p {
  margin-bottom: 0;
}
.products .grid .thumbnails {
  display: flex;
  justify-content: center;
  align-items: center;
}
.products .grid .thumbnails img {
  height: 128px;
}
.products .grid .thumbnails:hover {
  transform: scale(2) translateX(90px);
  box-shadow: 0 0 1px 0 var(--bs-border-color);
  background: #fff;
  border-radius: var(--bs-border-radius);
  z-index: 1;
  cursor: zoom-in;
}
.products .btn-light {
  --bs-btn-bg: #f2f2f2;
  --bs-btn-border-color: var(--bs-border-color);
  --bs-btn-disabled-bg: #f2f2f2;
  --bs-btn-disabled-border-color: var(--bs-border-color);
}
.products .btn-success {
  --bs-btn-color: #000;
  --bs-btn-bg: #e0ffc8;
  --bs-btn-border-color: #e0ffc8;
  --bs-btn-disabled-bg: #e0ffc8;
  --bs-btn-disabled-border-color: #e0ffc8;
}
.products .btn-danger {
  --bs-btn-color: #000;
  --bs-btn-bg: #ffc8c8;
  --bs-btn-border-color: #ffc8c8;
  --bs-btn-disabled-bg: #ffc8c8;
  --bs-btn-disabled-border-color: #ffc8c8;
}
.products .btn-price {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  flex-direction: column;
  font-family: var(--bs-font-monospace);
}

.display {
  font-family: "Poppins", sans-serif;
}

footer .text-bg-black {
  background-color: #000;
  color: #fff;
}
footer .h1 {
  font-size: 1.5rem;
}
footer a {
  color: #fff;
  text-decoration: none;
}
footer .social {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 15px;
}
footer .social svg {
  width: 32px;
  height: 32px;
}

#upload-preview {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 1rem;
}
#upload-preview figure {
  margin-bottom: 0;
  text-align: center;
}
#upload-preview figure img {
  margin-bottom: 1rem;
}
#upload-preview .invalid {
  display: flex;
  flex-direction: column;
  background-color: var(--bs-light);
  padding: 1rem;
  border: 1px solid var(--bs-danger);
}