@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=Inter:wght@300;400;500;600&display=swap');

:root {
  --dtb-primary: #e8aa4e;
  --dtb-secondary: #302621;
  --dtb-hover: #f0bc6a;
  --dtb-font-family: 'Inter';
  --dtb-color: #f6f1e9;

  --dtb-btn-color: #16100d;
  --dtb-btn-bg: var(--dtb-primary);
  --dtb-btn-active-bg: var(--dtb-primary);
  --dtb-btn-active-color: var(--dtb-btn-color);
  --dtb-btn-hover-color: var(--dtb-btn-active-color);
  --dtb-btn-secondary: #302621;
  --dtb-btn-secondary-color: #f6f1e9;

  --dtb-input-border-focus: var(--dtb-primary);
  --bs-link-color: var(--dtb-primary);
  --bs-link-hover-color: var(--dtb-hover);
}

:root {
  --dtb-surface: #16100d;
  --dtb-surface-raised: #201915;
  --dtb-input: #2f2723;
  --dtb-on-surface: #f6f1e9;
  --dtb-muted: #aca399;
  --dtb-line: #39312d;
  --dtb-primary-rgb: 232, 170, 78;
  --dtb-shadow-gold: 0 10px 40px -10px rgba(var(--dtb-primary-rgb), 0.3);
  --dtb-radius: 6px;
  --dtb-font-display: 'Cormorant Garamond', Georgia, serif;
}

[data-bs-theme=dark] {
  --bs-body-bg: var(--dtb-surface);
  --bs-body-bg-rgb: 22, 16, 13;
  --bs-body-color: var(--dtb-on-surface);
  --bs-body-color-rgb: 246, 241, 233;
  --bs-emphasis-color: var(--dtb-on-surface);
  --bs-secondary-color: var(--dtb-muted);
  --bs-tertiary-color: var(--dtb-muted);
  --bs-secondary-bg: var(--dtb-input);
  --bs-tertiary-bg: var(--dtb-surface-raised);
  --bs-border-color: var(--dtb-line);
  --bs-border-color-translucent: var(--dtb-line);
  --bs-link-color: var(--dtb-primary);
  --bs-link-color-rgb: 232, 170, 78;
  --bs-link-hover-color: var(--dtb-hover);
  --bs-link-hover-color-rgb: 240, 188, 106;
}

body {
  background-image: radial-gradient(at top, #271d17, transparent 60%),
    radial-gradient(at bottom, #120c09, transparent 70%);
  background-attachment: fixed;
}

.bg-white,
.bg-light,
.dtb-navbar,
.dtb-card,
.dtb-card > div:first-child,
.dtb-container,
.dtb-cookie-banner,
#dtb-custom-nav-tabs,
#dtb-custom-cart-btn-wrapper {
  background-color: var(--dtb-surface-raised) !important;
}

.text-dark,
.text-black,
.dtb-card,
.item-variables {
  color: var(--dtb-on-surface) !important;
}

.text-secondary,
.item-description,
.form-info-feedback {
  color: var(--dtb-muted) !important;
}

.border-dark {
  border-color: var(--dtb-line) !important;
}

h1,
h2,
h3,
h4,
.modal-title {
  font-family: var(--dtb-font-display);
  font-weight: 500;
  letter-spacing: -.01em;
}

h2 {
  color: var(--dtb-primary);
}

.dtb-navbar h1 {
  color: var(--dtb-primary) !important;
}

.modal {
  --bs-modal-bg: var(--dtb-surface-raised);
}

.modal-backdrop {
  --bs-backdrop-opacity: 0.75;
}

.dropdown-menu,
.dtb-dropdown {
  --bs-dropdown-bg: var(--dtb-surface-raised);
  --bs-dropdown-link-hover-color: var(--dtb-btn-color);
  --bs-dropdown-link-hover-bg: var(--dtb-primary);
  background-color: var(--dtb-surface-raised) !important;
}

.card {
  --bs-card-bg: var(--dtb-surface-raised);
}

.list-group {
  --bs-list-group-bg: var(--dtb-surface-raised);
}

.dtb-card.border:hover {
  border-color: rgba(var(--dtb-primary-rgb), 0.6) !important;
}

.btn {
  --bs-btn-border-radius: var(--dtb-radius);
  --bs-btn-border-radius-sm: var(--dtb-radius);
  --bs-btn-border-radius-lg: var(--dtb-radius);
  --bs-btn-font-weight: 500;
}

.btn-primary,
#dtb-custom-cart-btn {
  background-color: var(--dtb-primary);
  border: 0;
  box-shadow: var(--dtb-shadow-gold);
  color: var(--dtb-btn-color) !important;
  transition: opacity .15s ease;
}

.btn-primary:hover,
#dtb-custom-cart-btn:hover {
  opacity: .9;
}

#dtb-custom-cart-btn {
  border-radius: var(--dtb-radius) !important;
  font-weight: 500;
}

.btn-outline-primary,
.btn-outline-secondary {
  --bs-btn-color: var(--dtb-primary);
  --bs-btn-border-color: rgba(var(--dtb-primary-rgb), 0.6);
  --bs-btn-hover-color: var(--dtb-primary);
  --bs-btn-hover-bg: rgba(var(--dtb-primary-rgb), 0.1);
  --bs-btn-hover-border-color: rgba(var(--dtb-primary-rgb), 0.6);
  --bs-btn-active-color: var(--dtb-btn-color);
  --bs-btn-active-bg: var(--dtb-primary);
  --bs-btn-active-border-color: var(--dtb-primary);
  --bs-btn-disabled-color: var(--dtb-muted);
  --bs-btn-disabled-border-color: var(--dtb-line);
}

#dtb-custom-nav-tabs li.nav-item a {
  color: var(--dtb-muted) !important;
  background-color: transparent !important;
  border-color: var(--dtb-line) !important;
  border-radius: var(--dtb-radius) !important;
}

#dtb-custom-nav-tabs li.nav-item a:hover {
  color: var(--dtb-primary) !important;
  background-color: transparent !important;
  border-color: rgba(var(--dtb-primary-rgb), 0.6) !important;
}

#dtb-custom-nav-tabs li.nav-item a.active {
  color: var(--dtb-btn-color) !important;
  background-color: var(--dtb-primary) !important;
  border-color: var(--dtb-primary) !important;
}

.form-control,
.form-select,
.input-group-text {
  background-color: var(--dtb-input);
}

.form-control,
.form-select {
  border-radius: var(--dtb-radius);
}

.dtb-input-address,
.dtb-location-dropdown {
  border: 1px solid var(--dtb-line) !important;
  border-radius: var(--dtb-radius) !important;
  overflow: hidden;
}

.dtb-input-address .bg-light,
.dtb-location-dropdown .bg-light {
  background-color: var(--dtb-input) !important;
}

.dtb-input-address i,
.dtb-location-dropdown i {
  color: var(--dtb-primary) !important;
}

.dtb-input-address .btn,
.dtb-input-address .form-control {
  border-radius: 0 !important;
}

.dtb-input-address .btn {
  border: 0;
}

.badge {
  border-radius: 999px;
}

.dtb-add-icon,
.dtb-card .bi-plus-circle-fill,
.dtb-cart-control i,
.dtb-item-summary i {
  color: var(--dtb-primary) !important;
}

::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}

::-webkit-scrollbar-track {
  background: var(--dtb-surface);
}

::-webkit-scrollbar-thumb {
  background: var(--dtb-line);
  border-radius: 50px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--dtb-primary);
}
