@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700&display=swap");
body {
  font-family: "Plus Jakarta Sans", system-ui, -apple-system, sans-serif !important;
  background-color: #f8faf9 !important;
  color: #0f172a !important;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "Plus Jakarta Sans", system-ui, -apple-system, sans-serif;
  font-weight: 700;
  color: #0f172a;
}

.navbar.navbar-tamiana {
  background: #ffffff !important;
  border-bottom: 4px solid #2d6a4f !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.02) !important;
  padding: 0.75rem 1rem;
  transition: all 0.3s ease;
}
.navbar.navbar-tamiana .navbar-brand {
  font-weight: 700;
  font-size: 1.45rem;
  letter-spacing: -0.5px;
  color: #0f172a !important;
  background: none !important;
  -webkit-text-fill-color: initial !important;
  transition: color 0.2s ease;
}
.navbar.navbar-tamiana .navbar-brand:hover {
  color: #2d6a4f !important;
}
.navbar.navbar-tamiana .nav-link {
  font-weight: 600;
  color: #334155 !important;
  border-radius: 8px;
  padding: 0.5rem 1rem !important;
  margin: 0 2px;
  transition: all 0.2s ease;
}
.navbar.navbar-tamiana .nav-link:hover {
  color: #2d6a4f !important;
  background-color: #edf7f4 !important;
}
.navbar.navbar-tamiana .nav-link.active {
  color: #7b2cbf !important;
  background-color: #f3e8ff !important;
  border: 1px solid rgba(123, 44, 191, 0.12);
  font-weight: 700;
}
.navbar.navbar-tamiana .navbar-toggler {
  border-color: #e2e8f0 !important;
}
.navbar.navbar-tamiana .navbar-toggler:focus {
  box-shadow: 0 0 0 3px rgba(45, 106, 79, 0.15);
}

.page-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 1.75rem;
  margin-bottom: 1.75rem;
}
.page-header h1 {
  font-weight: 750;
  letter-spacing: -0.5px;
  color: #0f172a;
}

.page-description {
  margin-bottom: 24px;
  color: #334155;
  font-size: 1.05rem;
  font-weight: 450;
}

.card {
  background: rgba(255, 255, 255, 0.82);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-radius: 16px !important;
  border: 1px solid rgba(255, 255, 255, 0.5) !important;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.06) !important;
  overflow: hidden;
  transition: transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1), box-shadow 0.3s ease, border-color 0.3s ease;
}
.card:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 40px rgba(15, 23, 42, 0.08) !important;
  border-color: rgba(45, 106, 79, 0.25) !important;
}
.card .card-header {
  background-color: transparent;
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
  padding: 1.25rem;
  font-weight: 700;
  color: #0f172a;
}
.card .card-body {
  padding: 1.25rem;
  color: #334155;
}
.card.card-info {
  background-color: #edf7f4 !important;
  border-color: rgba(45, 106, 79, 0.12) !important;
  color: #1b4332;
}
.card.card-info h2, .card.card-info h3, .card.card-info h4, .card.card-info h5 {
  color: #1b4332 !important;
}

.separator {
  border: 0;
  border-top: 1px solid #f1f5f9;
  margin: 15px 0;
}

.btn {
  border-radius: 8px !important;
  font-weight: 600 !important;
  padding: 0.6rem 1.25rem !important;
  font-size: 0.95rem;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
  cursor: pointer;
}
.btn:hover {
  transform: translateY(-1.5px);
  box-shadow: 0 6px 15px rgba(0, 0, 0, 0.08);
}
.btn:active {
  transform: translateY(0.5px);
}
.btn.btn-primary {
  background: #0d6efd !important;
  border: none !important;
  color: #ffffff !important;
}
.btn.btn-primary:hover {
  background: #0b5edf !important;
}
.btn.btn-success {
  background: #2d6a4f !important;
  border: none !important;
  color: #ffffff !important;
}
.btn.btn-success:hover {
  background: #1b4332 !important;
}
.btn.btn-lg {
  padding: 0.75rem 1.5rem !important;
  font-size: 1.05rem;
}
.btn.btn-secondary {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  color: #0f172a !important;
  margin-left: 10px;
}
.btn.btn-secondary:hover {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
}
.btn.btn-outline-secondary {
  border: 1px solid #e2e8f0 !important;
  background-color: transparent !important;
  color: #334155 !important;
}
.btn.btn-outline-secondary:hover {
  background-color: #f1f5f9 !important;
  color: #0f172a !important;
  border-color: #cbd5e1 !important;
}
.btn.btn-dashed {
  margin-top: 20px;
  padding: 12px 20px !important;
  border: 2px dashed #cbd5e1 !important;
  background: transparent !important;
  width: 100%;
  color: #334155 !important;
}
.btn.btn-dashed:hover {
  border-color: #2d6a4f !important;
  color: #2d6a4f !important;
  background-color: #edf7f4 !important;
}

.form-control, .form-select {
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  padding: 0.6rem 1rem;
  color: #0f172a;
  font-weight: 500;
  transition: all 0.2s ease;
}
.form-control:focus, .form-select:focus {
  border-color: #2d6a4f;
  box-shadow: 0 0 0 4px rgba(45, 106, 79, 0.12);
}

.form-select {
  padding-right: 2.25rem !important;
}

.form-select-sm {
  padding-right: 2rem !important;
}

.shopping-card {
  border: none !important;
  padding-top: 10px;
  box-shadow: none !important;
  background: transparent !important;
}
.shopping-card .card-header-toggle {
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  user-select: none;
  margin-bottom: 12px;
  padding: 10px 0;
}
.shopping-card .card-header-toggle h4, .shopping-card .card-header-toggle h5 {
  color: #0f172a;
  font-weight: 750;
}
.shopping-card .card-header-toggle .toggle-icon {
  transition: transform 0.3s ease;
  color: #2d6a4f;
  font-size: 1.25rem;
}
.shopping-card.collapsed .card-content {
  display: none;
}
.shopping-card.collapsed .toggle-icon {
  transform: rotate(-90deg);
}

.shopping-list {
  padding: 0;
  margin: 0;
  list-style: none;
}

.shopping-list-item:nth-child(even) {
  background-color: rgba(15, 23, 42, 0.01);
}

.shopping-item-form {
  display: flex;
  align-items: center;
  width: 100%;
}

.archive-list-item {
  display: flex;
  align-items: center;
  width: 100%;
}

.archive-date-header {
  font-size: 1.1em;
  margin-top: 20px;
  margin-bottom: 10px;
  color: #0f172a;
  font-weight: 700;
}

.list-item {
  padding: 12px 18px;
  border-bottom: 1px solid #f1f5f9;
  display: flex;
  align-items: center;
  background-color: #ffffff;
  border-radius: 10px;
  margin-bottom: 8px;
  border: 1px solid rgba(226, 232, 240, 0.6);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.005);
  transition: all 0.2s ease;
}
.list-item:hover {
  border-color: rgba(45, 106, 79, 0.2);
  box-shadow: 0 4px 12px rgba(45, 106, 79, 0.04);
}
.list-item:last-child {
  border-bottom: 1px solid rgba(226, 232, 240, 0.6);
}
.list-item .checkbox-large {
  margin-right: 15px;
  transform: scale(1.25);
  accent-color: #7b2cbf;
  cursor: pointer;
}
.list-item .item-details {
  display: flex;
  align-items: center;
  flex: 1;
  gap: 8px;
  flex-wrap: wrap;
  color: #0f172a;
}
.list-item .item-qty {
  color: #334155;
  text-align: right;
  font-weight: 600;
}
.list-item .item-tag {
  font-size: 0.75rem;
  padding: 3px 10px;
  border-radius: 20px;
  margin-right: 10px;
  font-weight: 600;
}
.list-item .tag-meal-plan {
  background-color: #f3e8ff;
  color: #7b2cbf;
}
.list-item .tag-low-pantry {
  background-color: #ffebee;
  color: #c62828;
}

.section-card {
  margin-bottom: 1.5rem !important;
  border-left: 4.5px solid #2d6a4f !important;
  border-radius: 4px 16px 16px 4px !important;
}
.section-card .section-header {
  background: #ffffff !important;
  cursor: pointer;
  border-bottom: 1px solid #f1f5f9 !important;
}
.section-card .section-header h5 {
  color: #0f172a;
  font-weight: 750;
}
.section-card .toggle-icon {
  color: #64748b;
  transition: transform 0.3s ease;
}
.section-card.collapsed .section-body {
  display: none;
}
.section-card.collapsed .toggle-icon {
  transform: rotate(-90deg);
}

.pantry-item-row {
  transition: background-color 0.2s ease;
}
.pantry-item-row:hover {
  background-color: rgba(45, 106, 79, 0.02) !important;
}
.pantry-item-row td {
  padding: 14px 12px;
  border-bottom: 1px solid #f1f5f9;
  vertical-align: middle;
  color: #0f172a;
}
.pantry-item-row .qty-btn {
  border-radius: 50% !important;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 !important;
  line-height: 1;
  font-size: 1.1rem;
  border: 1px solid #e2e8f0 !important;
  background-color: #ffffff !important;
  color: #0f172a !important;
  transition: all 0.2s ease;
}
.pantry-item-row .qty-btn:hover {
  background-color: #2d6a4f !important;
  border-color: #2d6a4f !important;
  color: #ffffff !important;
}

.form-group {
  margin-top: 12px;
}

.label-block {
  display: block;
  margin-bottom: 6px;
  font-weight: 600;
  color: #0f172a;
}

.label-inline {
  margin-right: 15px;
  font-weight: 500;
}

.meal-plan-container .meal-slot {
  display: flex;
  flex-direction: column;
  background-color: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 20px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.005);
  transition: all 0.2s ease;
}
.meal-plan-container .meal-slot:hover {
  border-color: rgba(45, 106, 79, 0.2);
  box-shadow: 0 8px 20px rgba(45, 106, 79, 0.04);
}
.meal-plan-container .meal-slot .recipe-card .card-body {
  padding-top: 2.25rem !important;
}
.meal-plan-container .meal-slot .recipe-card .card-title {
  padding-right: 85px !important;
}
.meal-plan-container .meal-slot .meal-type-title {
  font-size: 1.15rem;
  font-weight: 700;
  color: #0f172a;
  text-align: center;
  margin-bottom: 16px;
  border-bottom: 2.5px solid #edf7f4;
  padding-bottom: 8px;
}
.meal-plan-container .meal-slot .empty-meal-btn {
  flex-grow: 1;
  border: 2px dashed #cbd5e1;
  background-color: #f8fafc;
  color: #64748b;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 180px;
  border-radius: 12px;
  text-decoration: none;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}
.meal-plan-container .meal-slot .empty-meal-btn:hover {
  background-color: #edf7f4;
  border-color: #2d6a4f;
  color: #2d6a4f;
  transform: scale(1.02);
}
.meal-plan-container .meal-slot .empty-meal-btn:hover .plus-icon {
  color: #2d6a4f;
}
.meal-plan-container .meal-slot .empty-meal-btn .plus-icon {
  font-size: 2.5rem;
  font-weight: 300;
  margin-bottom: 8px;
  line-height: 1;
  color: #64748b;
  transition: color 0.25s ease;
}

.meal-plan-table td, .meal-plan-table th {
  vertical-align: middle;
  text-align: center;
  padding: 12px 10px;
  color: #0f172a;
}
.meal-plan-table td:has(.form-check-input) {
  cursor: pointer;
}
.meal-plan-table td:has(.form-check-input):hover {
  background-color: #f1f5f9;
}

.actions {
  margin-top: 24px;
}

.table-pantry {
  width: 100%;
  border-collapse: collapse;
}
.table-pantry thead tr {
  text-align: left;
  background-color: #f8fafc;
  border-bottom: 2px solid #e2e8f0;
}
.table-pantry th {
  padding: 12px;
  color: #0f172a;
  font-weight: 700;
}

.table-recipes {
  width: 100%;
  border-collapse: collapse;
  margin-top: 1.5rem;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid #e2e8f0;
}
.table-recipes thead tr {
  text-align: left;
  background-color: #f1f5f9;
}
.table-recipes th, .table-recipes td {
  padding: 12px;
  border: 1px solid #e2e8f0;
  color: #0f172a;
}
.table-recipes tbody tr:nth-child(even) {
  background-color: #f8fafc;
}

.search-container {
  margin-bottom: 2.5rem;
}
.search-container .search-input {
  padding: 12px 16px;
  width: 100%;
  max-width: 450px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  color: #0f172a;
  font-weight: 500;
  transition: all 0.2s ease;
}
.search-container .search-input:focus {
  border-color: #2d6a4f;
  box-shadow: 0 0 0 4px rgba(45, 106, 79, 0.12);
}

.milestone {
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 24px;
  margin-bottom: 20px;
  background-color: #ffffff;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.005);
}
.milestone h3 {
  margin-top: 0;
  color: #0f172a;
}
.milestone p {
  color: #334155;
}

.tag {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 20px;
  font-size: 0.8rem;
  font-weight: 700;
  color: #ffffff;
}
.tag.planned {
  background-color: #6c757d;
}
.tag.in-progress {
  background-color: #17a2b8;
}
.tag.completed {
  background-color: #2d6a4f;
}

.recipe-card {
  position: relative;
  overflow: hidden;
}
.recipe-card .card-title a {
  color: #0f172a !important;
  font-weight: 750;
}
.recipe-card .card-title a:hover {
  color: #2d6a4f !important;
}
.recipe-card .card-footer {
  background-color: #ffffff;
  border-top: 1px solid #f1f5f9;
  padding: 10px 1.25rem;
}

body.theme-lifelike .btn.remove-meal-btn,
body.theme-lifelike .btn.swap-meal-btn,
body.theme-comic_book .btn.remove-meal-btn,
body.theme-comic_book .btn.swap-meal-btn,
body.theme-clay .btn.remove-meal-btn,
body.theme-clay .btn.swap-meal-btn,
body.theme-3d .btn.remove-meal-btn,
body.theme-3d .btn.swap-meal-btn,
body .btn.remove-meal-btn,
body .btn.swap-meal-btn {
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
  width: auto !important;
  height: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 0 !important;
}
body.theme-lifelike .btn.remove-meal-btn i,
body.theme-lifelike .btn.swap-meal-btn i,
body.theme-comic_book .btn.remove-meal-btn i,
body.theme-comic_book .btn.swap-meal-btn i,
body.theme-clay .btn.remove-meal-btn i,
body.theme-clay .btn.swap-meal-btn i,
body.theme-3d .btn.remove-meal-btn i,
body.theme-3d .btn.swap-meal-btn i,
body .btn.remove-meal-btn i,
body .btn.swap-meal-btn i {
  transition: transform 0.2s ease-in-out !important;
}
body.theme-lifelike .btn.remove-meal-btn:hover,
body.theme-lifelike .btn.swap-meal-btn:hover,
body.theme-comic_book .btn.remove-meal-btn:hover,
body.theme-comic_book .btn.swap-meal-btn:hover,
body.theme-clay .btn.remove-meal-btn:hover,
body.theme-clay .btn.swap-meal-btn:hover,
body.theme-3d .btn.remove-meal-btn:hover,
body.theme-3d .btn.swap-meal-btn:hover,
body .btn.remove-meal-btn:hover,
body .btn.swap-meal-btn:hover {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  transform: none !important;
}
body.theme-lifelike .btn.remove-meal-btn:hover i,
body.theme-lifelike .btn.swap-meal-btn:hover i,
body.theme-comic_book .btn.remove-meal-btn:hover i,
body.theme-comic_book .btn.swap-meal-btn:hover i,
body.theme-clay .btn.remove-meal-btn:hover i,
body.theme-clay .btn.swap-meal-btn:hover i,
body.theme-3d .btn.remove-meal-btn:hover i,
body.theme-3d .btn.swap-meal-btn:hover i,
body .btn.remove-meal-btn:hover i,
body .btn.swap-meal-btn:hover i {
  transform: scale(1.15) !important;
}
body.theme-lifelike .btn.remove-meal-btn:active i,
body.theme-lifelike .btn.swap-meal-btn:active i,
body.theme-comic_book .btn.remove-meal-btn:active i,
body.theme-comic_book .btn.swap-meal-btn:active i,
body.theme-clay .btn.remove-meal-btn:active i,
body.theme-clay .btn.swap-meal-btn:active i,
body.theme-3d .btn.remove-meal-btn:active i,
body.theme-3d .btn.swap-meal-btn:active i,
body .btn.remove-meal-btn:active i,
body .btn.swap-meal-btn:active i {
  transform: scale(0.95) !important;
}

#authTabs {
  border-bottom: none;
}
#authTabs .nav-link {
  color: rgba(15, 23, 42, 0.75) !important;
  border: none;
  font-weight: 600;
  padding: 12px 20px;
  border-radius: 8px 8px 0 0;
  transition: all 0.2s ease;
}
#authTabs .nav-link:hover:not(.active) {
  color: #0f172a !important;
  background-color: #f8fafc;
}
#authTabs .nav-link.active {
  color: #0f172a !important;
  background-color: #ffffff !important;
  border: none;
}

/* ==========================================
   Recipe Page tabbed navigation
   ========================================== */
.recipe-tab-nav {
  border-bottom: 2px solid #f1f5f9;
  gap: 8px;
}
.recipe-tab-nav .nav-item {
  margin-bottom: -2px;
}
.recipe-tab-nav .nav-link {
  border: none !important;
  border-bottom: 3px solid transparent !important;
  color: #334155 !important;
  font-weight: 600;
  font-size: 0.95rem;
  padding: 10px 16px;
  transition: all 0.2s ease;
  border-radius: 0 !important;
  background: transparent !important;
}
.recipe-tab-nav .nav-link:hover {
  color: #2d6a4f !important;
  border-bottom-color: rgba(45, 106, 79, 0.3) !important;
}
.recipe-tab-nav .nav-link.active {
  color: #2d6a4f !important;
  border-bottom-color: #2d6a4f !important;
  font-weight: 700;
}

body.theme-3d .recipe-tab-nav {
  border-bottom-color: #1f2937;
}
body.theme-3d .recipe-tab-nav .nav-link {
  color: #94a3b8 !important;
}
body.theme-3d .recipe-tab-nav .nav-link:hover {
  color: #2d6a4f !important;
  border-bottom-color: rgba(45, 106, 79, 0.4) !important;
}
body.theme-3d .recipe-tab-nav .nav-link.active {
  color: #2d6a4f !important;
  border-bottom-color: #2d6a4f !important;
}

body.theme-comic_book .recipe-tab-nav {
  border-bottom: 3px solid #000000;
}
body.theme-comic_book .recipe-tab-nav .nav-link {
  border: 2px solid transparent !important;
  border-radius: 8px 8px 0 0 !important;
  margin-right: 4px;
}
body.theme-comic_book .recipe-tab-nav .nav-link:hover {
  background-color: #edf7f4 !important;
  border-color: #000000 #000000 transparent #000000 !important;
  color: #2d6a4f !important;
}
body.theme-comic_book .recipe-tab-nav .nav-link.active {
  background-color: #ffffff !important;
  border: 3px solid #000000 !important;
  border-bottom-color: #ffffff !important;
  color: #000000 !important;
  margin-bottom: -3px;
}

body.theme-clay .recipe-tab-nav {
  border-bottom-color: #f0ece6;
}
body.theme-clay .recipe-tab-nav .nav-link {
  border-radius: 12px 12px 0 0 !important;
  margin-right: 4px;
}
body.theme-clay .recipe-tab-nav .nav-link:hover {
  color: #d97706 !important;
  background-color: #fef3c7 !important;
}
body.theme-clay .recipe-tab-nav .nav-link.active {
  color: #d97706 !important;
  background-color: #ffffff !important;
  border-bottom-color: #d97706 !important;
}

.nav-pills .nav-link {
  color: #334155 !important;
  transition: all 0.2s ease;
  border: 1px solid transparent;
}
.nav-pills .nav-link svg, .nav-pills .nav-link svg.text-primary {
  color: #64748b !important;
  transition: color 0.2s ease;
}
.nav-pills .nav-link:hover {
  color: #2d6a4f !important;
  background-color: #edf7f4 !important;
}
.nav-pills .nav-link:hover svg, .nav-pills .nav-link:hover svg.text-primary {
  color: #2d6a4f !important;
}
.nav-pills .nav-link.active {
  color: #7b2cbf !important;
  background-color: #f3e8ff !important;
  border-color: rgba(123, 44, 191, 0.12) !important;
  font-weight: 700;
}
.nav-pills .nav-link.active svg, .nav-pills .nav-link.active svg.text-primary {
  color: #7b2cbf !important;
}

.tab-pane h3.text-primary {
  color: #0f172a !important;
  font-weight: 750;
  margin-bottom: 0.5rem;
}
.tab-pane svg.text-primary {
  color: #2d6a4f !important;
}

.step-card {
  transition: transform 0.2s ease, opacity 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease !important;
  user-select: none;
}
.step-card .drag-handle {
  cursor: grab;
  padding: 2px;
  border-radius: 4px;
  transition: background-color 0.2s ease;
}
.step-card .drag-handle:hover {
  background-color: #f1f5f9;
  color: #0f172a !important;
}
.step-card .drag-handle:active {
  cursor: grabbing;
}
.step-card.drag-over {
  border: 2px dashed #2d6a4f !important;
  transform: scale(1.015);
  background-color: #edf7f4 !important;
  box-shadow: 0 8px 24px rgba(45, 106, 79, 0.08) !important;
}

body.theme-3d {
  background-color: #0b0f19 !important;
  color: #f8fafc !important;
}
body.theme-3d h1, body.theme-3d h2, body.theme-3d h3, body.theme-3d h4, body.theme-3d h5, body.theme-3d h6 {
  color: #f8fafc !important;
}
body.theme-3d p, body.theme-3d span, body.theme-3d .text-muted, body.theme-3d .text-muted-slate {
  color: #94a3b8 !important;
}
body.theme-3d .text-dark {
  color: #f8fafc !important;
}
body.theme-3d .navbar.navbar-tamiana {
  background: #111827 !important;
  border-bottom: 4px solid #2d6a4f !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2) !important;
}
body.theme-3d .navbar.navbar-tamiana .navbar-brand {
  color: #f8fafc !important;
}
body.theme-3d .navbar.navbar-tamiana .navbar-brand:hover {
  color: #2d6a4f !important;
}
body.theme-3d .navbar.navbar-tamiana .nav-link {
  color: #cbd5e1 !important;
}
body.theme-3d .navbar.navbar-tamiana .nav-link:hover {
  color: #2d6a4f !important;
  background-color: rgba(45, 106, 79, 0.15) !important;
}
body.theme-3d .navbar.navbar-tamiana .nav-link.active {
  color: #c084fc !important;
  background-color: rgba(123, 44, 191, 0.2) !important;
  border-color: rgba(123, 44, 191, 0.3) !important;
}
body.theme-3d .card {
  background: #131b2e !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2) !important;
}
body.theme-3d .card .card-header, body.theme-3d .card .card-header-toggle {
  background-color: #111827 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  color: #f8fafc !important;
}
body.theme-3d .card .card-body {
  color: #cbd5e1 !important;
}
body.theme-3d .card.card-info {
  background-color: rgba(45, 106, 79, 0.1) !important;
  border-color: rgba(45, 106, 79, 0.2) !important;
  color: #a7f3d0 !important;
}
body.theme-3d .card.card-info h2, body.theme-3d .card.card-info h3, body.theme-3d .card.card-info h4, body.theme-3d .card.card-info h5 {
  color: #a7f3d0 !important;
}
body.theme-3d .separator {
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}
body.theme-3d .btn.btn-secondary {
  background: #1e293b !important;
  border: 1px solid #334155 !important;
  color: #f8fafc !important;
}
body.theme-3d .btn.btn-secondary:hover {
  background: #334155 !important;
  border-color: #475569 !important;
}
body.theme-3d .btn.btn-outline-secondary {
  border: 1px solid #334155 !important;
  background-color: transparent !important;
  color: #cbd5e1 !important;
}
body.theme-3d .btn.btn-outline-secondary:hover {
  background-color: #1e293b !important;
  color: #f8fafc !important;
  border-color: #475569 !important;
}
body.theme-3d .btn.btn-dashed {
  border-color: rgba(255, 255, 255, 0.15) !important;
  color: #cbd5e1 !important;
}
body.theme-3d .btn.btn-dashed:hover {
  border-color: #2d6a4f !important;
  color: #a7f3d0 !important;
  background-color: rgba(45, 106, 79, 0.1) !important;
}
body.theme-3d .form-control, body.theme-3d .form-select {
  background-color: #1e293b !important;
  border: 1px solid #334155 !important;
  color: #f8fafc !important;
}
body.theme-3d .form-control:focus, body.theme-3d .form-select:focus {
  border-color: #2d6a4f !important;
  box-shadow: 0 0 0 4px rgba(45, 106, 79, 0.3) !important;
}
body.theme-3d .form-check-inline {
  border-color: #334155 !important;
  background-color: #131b2e !important;
}
body.theme-3d .form-check-label {
  color: #cbd5e1 !important;
}
body.theme-3d .form-check-input {
  background-color: #1e293b !important;
  border-color: #334155 !important;
}
body.theme-3d .form-check-input:checked {
  background-color: #2d6a4f !important;
  border-color: #2d6a4f !important;
}
body.theme-3d .list-item {
  background-color: #131b2e !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  color: #f8fafc !important;
}
body.theme-3d .list-item:hover {
  border-color: rgba(45, 106, 79, 0.4) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
}
body.theme-3d .list-item .item-details {
  color: #f8fafc !important;
}
body.theme-3d .list-item .item-qty {
  color: #cbd5e1 !important;
}
body.theme-3d .pantry-item-row:hover {
  background-color: rgba(45, 106, 79, 0.05) !important;
}
body.theme-3d .pantry-item-row td {
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  color: #f8fafc !important;
}
body.theme-3d .pantry-item-row .qty-btn {
  border-color: #334155 !important;
  background-color: #1e293b !important;
  color: #f8fafc !important;
}
body.theme-3d .pantry-item-row .qty-btn:hover {
  background-color: #2d6a4f !important;
  border-color: #2d6a4f !important;
  color: #ffffff !important;
}
body.theme-3d .section-card {
  border-left-color: #2d6a4f !important;
}
body.theme-3d .section-card .section-header {
  background: #111827 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}
body.theme-3d .section-card .section-header h5 {
  color: #f8fafc !important;
}
body.theme-3d .meal-plan-container .meal-slot {
  background-color: #131b2e !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}
body.theme-3d .meal-plan-container .meal-slot:hover {
  border-color: rgba(45, 106, 79, 0.4) !important;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2) !important;
}
body.theme-3d .meal-plan-container .meal-slot .meal-type-title {
  color: #f8fafc !important;
  border-bottom-color: rgba(45, 106, 79, 0.2) !important;
}
body.theme-3d .meal-plan-container .meal-slot .empty-meal-btn {
  border-color: #334155 !important;
  background-color: #1e293b !important;
  color: #94a3b8 !important;
}
body.theme-3d .meal-plan-container .meal-slot .empty-meal-btn:hover {
  background-color: rgba(45, 106, 79, 0.1) !important;
  border-color: #2d6a4f !important;
  color: #a7f3d0 !important;
}
body.theme-3d .meal-plan-container .meal-slot .empty-meal-btn:hover .plus-icon {
  color: #a7f3d0 !important;
}
body.theme-3d .meal-plan-container .meal-slot .empty-meal-btn .plus-icon {
  color: #94a3b8 !important;
}
body.theme-3d .meal-plan-table td, body.theme-3d .meal-plan-table th {
  border-color: rgba(255, 255, 255, 0.08) !important;
  color: #f8fafc !important;
}
body.theme-3d .meal-plan-table td:has(.form-check-input):hover {
  background-color: #1e293b !important;
}
body.theme-3d .table-pantry thead tr {
  background-color: #1e293b !important;
  border-bottom-color: #334155 !important;
}
body.theme-3d .table-pantry th {
  color: #f8fafc !important;
}
body.theme-3d .table-recipes {
  border-color: rgba(255, 255, 255, 0.08) !important;
}
body.theme-3d .table-recipes thead tr {
  background-color: #1e293b !important;
}
body.theme-3d .table-recipes th, body.theme-3d .table-recipes td {
  border-color: rgba(255, 255, 255, 0.08) !important;
  color: #f8fafc !important;
}
body.theme-3d .table-recipes tbody tr:nth-child(even) {
  background-color: #131b2e !important;
}
body.theme-3d .milestone {
  border-color: rgba(255, 255, 255, 0.08) !important;
  background-color: #131b2e !important;
}
body.theme-3d .milestone h3 {
  color: #f8fafc !important;
}
body.theme-3d .milestone p {
  color: #cbd5e1 !important;
}
body.theme-3d .recipe-card .card-title a {
  color: #f8fafc !important;
}
body.theme-3d .recipe-card .card-title a:hover {
  color: #2d6a4f !important;
}
body.theme-3d .recipe-card .card-footer {
  background-color: #131b2e !important;
  border-top-color: rgba(255, 255, 255, 0.08) !important;
}
body.theme-3d .recipe-card .remove-meal-btn, body.theme-3d .recipe-card .swap-meal-btn {
  background-color: rgba(30, 41, 59, 0.95) !important;
}
body.theme-3d .nav-pills .nav-link {
  color: #cbd5e1 !important;
}
body.theme-3d .nav-pills .nav-link:hover {
  color: #2d6a4f !important;
  background-color: rgba(45, 106, 79, 0.15) !important;
}
body.theme-3d .nav-pills .nav-link.active {
  color: #c084fc !important;
  background-color: rgba(123, 44, 191, 0.2) !important;
  border-color: rgba(123, 44, 191, 0.3) !important;
}
body.theme-3d .tab-pane h3.text-primary {
  color: #f8fafc !important;
}
body.theme-3d .assistant-drawer {
  background: rgba(30, 41, 59, 0.8) !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
  color: #f8fafc !important;
}
body.theme-3d .footer {
  background: #0f172a !important;
  border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
}
body.theme-3d .split-card {
  background: #131b2e !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2) !important;
}
body.theme-3d .split-card:hover {
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.4) !important;
}

body.theme-comic_book {
  background-color: #fffdf0 !important;
  color: #000000 !important;
}
body.theme-comic_book h1, body.theme-comic_book h2, body.theme-comic_book h3, body.theme-comic_book h4, body.theme-comic_book h5, body.theme-comic_book h6 {
  color: #000000 !important;
  font-weight: 800 !important;
}
body.theme-comic_book p, body.theme-comic_book span, body.theme-comic_book .text-muted, body.theme-comic_book .text-muted-slate {
  color: #1c1917 !important;
}
body.theme-comic_book .text-dark {
  color: #000000 !important;
}
body.theme-comic_book .navbar.navbar-tamiana {
  background: #ffffff !important;
  border-bottom: 5px solid #000000 !important;
  box-shadow: none !important;
}
body.theme-comic_book .navbar.navbar-tamiana .navbar-brand {
  color: #000000 !important;
  font-weight: 800 !important;
}
body.theme-comic_book .navbar.navbar-tamiana .navbar-brand:hover {
  color: #2d6a4f !important;
}
body.theme-comic_book .navbar.navbar-tamiana .nav-link {
  color: #000000 !important;
  border: 2px solid transparent;
}
body.theme-comic_book .navbar.navbar-tamiana .nav-link:hover {
  color: #2d6a4f !important;
  background-color: #edf7f4 !important;
  border-color: #000000 !important;
}
body.theme-comic_book .navbar.navbar-tamiana .nav-link.active {
  color: #7b2cbf !important;
  background-color: #f3e8ff !important;
  border-color: #000000 !important;
}
body.theme-comic_book .card, body.theme-comic_book .split-card {
  background: #ffffff !important;
  border: 3px solid #000000 !important;
  border-radius: 16px !important;
  box-shadow: 6px 6px 0px #000000 !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}
body.theme-comic_book .card .card-header, body.theme-comic_book .card .card-header-toggle, body.theme-comic_book .split-card .card-header, body.theme-comic_book .split-card .card-header-toggle {
  background-color: #ffffff !important;
  border-bottom: 3px solid #000000 !important;
  color: #000000 !important;
}
body.theme-comic_book .card .card-body, body.theme-comic_book .split-card .card-body {
  color: #1c1917 !important;
}
body.theme-comic_book .card.card-info, body.theme-comic_book .split-card.card-info {
  background-color: #fef08a !important;
  border-color: #000000 !important;
  color: #000000 !important;
}
body.theme-comic_book .card.card-info h2, body.theme-comic_book .card.card-info h3, body.theme-comic_book .card.card-info h4, body.theme-comic_book .card.card-info h5, body.theme-comic_book .split-card.card-info h2, body.theme-comic_book .split-card.card-info h3, body.theme-comic_book .split-card.card-info h4, body.theme-comic_book .split-card.card-info h5 {
  color: #000000 !important;
}
body.theme-comic_book .card:hover, body.theme-comic_book .split-card:hover {
  transform: translate(-2px, -2px) !important;
  box-shadow: 8px 8px 0px #000000 !important;
}
body.theme-comic_book .card:not(.recipe-card):not(.meal-slot):not(.split-card):not(.step-card):hover {
  transform: none !important;
  box-shadow: 6px 6px 0px #000000 !important;
}
body.theme-comic_book .separator {
  border-top: 3px solid #000000 !important;
}
body.theme-comic_book .btn {
  border: 2px solid #000000 !important;
  box-shadow: 3px 3px 0px #000000 !important;
  border-radius: 10px !important;
}
body.theme-comic_book .btn:hover {
  transform: translate(-1px, -1px) !important;
  box-shadow: 4px 4px 0px #000000 !important;
}
body.theme-comic_book .btn:active {
  transform: translate(1px, 1px) !important;
  box-shadow: 1px 1px 0px #000000 !important;
}
body.theme-comic_book .btn.btn-primary {
  background: #3b82f6 !important;
  color: #ffffff !important;
}
body.theme-comic_book .btn.btn-success {
  background: #2d6a4f !important;
  color: #ffffff !important;
}
body.theme-comic_book .btn.btn-secondary {
  background: #ffffff !important;
  color: #000000 !important;
}
body.theme-comic_book .btn.btn-outline-secondary {
  background: transparent !important;
  color: #000000 !important;
}
body.theme-comic_book .form-control, body.theme-comic_book .form-select {
  background-color: #ffffff !important;
  border: 2px solid #000000 !important;
  color: #000000 !important;
  border-radius: 10px !important;
  box-shadow: 2px 2px 0px rgba(0, 0, 0, 0.1) !important;
}
body.theme-comic_book .form-control:focus, body.theme-comic_book .form-select:focus {
  border-color: #2d6a4f !important;
  box-shadow: 0 0 0 3px rgba(45, 106, 79, 0.2) !important;
}
body.theme-comic_book .form-check-inline {
  border: 2px solid #000000 !important;
  box-shadow: 2px 2px 0px #000000 !important;
}
body.theme-comic_book .form-check-input {
  border: 2px solid #000000 !important;
}
body.theme-comic_book .list-item {
  background-color: #ffffff !important;
  border: 2px solid #000000 !important;
  box-shadow: 3px 3px 0px #000000 !important;
}
body.theme-comic_book .list-item:hover {
  border-color: #2d6a4f !important;
  box-shadow: 4px 4px 0px #2d6a4f !important;
}
body.theme-comic_book .pantry-item-row:hover {
  background-color: #f5f5f4 !important;
}
body.theme-comic_book .pantry-item-row td {
  border-bottom: 2px solid #000000 !important;
  color: #000000 !important;
}
body.theme-comic_book .pantry-item-row .qty-btn {
  border: 2px solid #000000 !important;
  box-shadow: 1px 1px 0px #000000 !important;
}
body.theme-comic_book .pantry-item-row .qty-btn:hover {
  background-color: #2d6a4f !important;
  color: #ffffff !important;
}
body.theme-comic_book .section-card {
  border-left: 6px solid #000000 !important;
}
body.theme-comic_book .section-card .section-header {
  background: #ffffff !important;
  border-bottom: 2px solid #000000 !important;
}
body.theme-comic_book .meal-plan-container .meal-slot {
  background-color: #ffffff !important;
  border: 2px solid #000000 !important;
  box-shadow: 4px 4px 0px #000000 !important;
}
body.theme-comic_book .meal-plan-container .meal-slot:hover {
  border-color: #2d6a4f !important;
  box-shadow: 6px 6px 0px #2d6a4f !important;
}
body.theme-comic_book .meal-plan-container .meal-slot .meal-type-title {
  border-bottom: 2px solid #000000 !important;
}
body.theme-comic_book .meal-plan-container .meal-slot .empty-meal-btn {
  border: 2px dashed #000000 !important;
  box-shadow: none !important;
}
body.theme-comic_book .meal-plan-container .meal-slot .empty-meal-btn:hover {
  background-color: #edf7f4 !important;
}
body.theme-comic_book .meal-plan-table td, body.theme-comic_book .meal-plan-table th {
  border: 2px solid #000000 !important;
  color: #000000 !important;
}
body.theme-comic_book .table-pantry thead tr {
  background-color: #f5f5f4 !important;
  border-bottom: 2px solid #000000 !important;
}
body.theme-comic_book .table-recipes {
  border: 2px solid #000000 !important;
}
body.theme-comic_book .table-recipes thead tr {
  background-color: #e7e5e4 !important;
}
body.theme-comic_book .table-recipes th, body.theme-comic_book .table-recipes td {
  border: 2px solid #000000 !important;
}
body.theme-comic_book .table-recipes tbody tr:nth-child(even) {
  background-color: #f5f5f4 !important;
}
body.theme-comic_book .milestone {
  border: 2px solid #000000 !important;
  box-shadow: 4px 4px 0px #000000 !important;
  background-color: #ffffff !important;
}
body.theme-comic_book .nav-pills .nav-link {
  border: 2px solid transparent !important;
}
body.theme-comic_book .nav-pills .nav-link:hover {
  background-color: #edf7f4 !important;
  border-color: #000000 !important;
}
body.theme-comic_book .nav-pills .nav-link.active {
  background-color: #f3e8ff !important;
  border-color: #000000 !important;
}
body.theme-comic_book .assistant-drawer {
  border: 3px solid #000000 !important;
  box-shadow: -8px 0px 0px #000000 !important;
  background: #ffffff !important;
}

body.theme-clay {
  background-color: #f6f3ed !important;
  color: #574c43 !important;
}
body.theme-clay h1, body.theme-clay h2, body.theme-clay h3, body.theme-clay h4, body.theme-clay h5, body.theme-clay h6 {
  color: #4b3e34 !important;
  font-weight: 750 !important;
}
body.theme-clay p, body.theme-clay span, body.theme-clay .text-muted, body.theme-clay .text-muted-slate {
  color: #786b5e !important;
}
body.theme-clay .text-dark {
  color: #4b3e34 !important;
}
body.theme-clay .navbar.navbar-tamiana {
  background: #ffffff !important;
  border-bottom: 4px solid #d97706 !important;
  border-radius: 0 0 24px 24px !important;
  box-shadow: 0 8px 24px rgba(180, 170, 160, 0.1) !important;
}
body.theme-clay .navbar.navbar-tamiana .navbar-brand {
  color: #4b3e34 !important;
}
body.theme-clay .navbar.navbar-tamiana .navbar-brand:hover {
  color: #d97706 !important;
}
body.theme-clay .navbar.navbar-tamiana .nav-link {
  color: #786b5e !important;
  border-radius: 16px !important;
}
body.theme-clay .navbar.navbar-tamiana .nav-link:hover {
  color: #d97706 !important;
  background-color: #fef3c7 !important;
}
body.theme-clay .navbar.navbar-tamiana .nav-link.active {
  color: #7b2cbf !important;
  background-color: #f3e8ff !important;
}
body.theme-clay .card, body.theme-clay .split-card {
  background: #ffffff !important;
  border: none !important;
  border-radius: 28px !important;
  box-shadow: 0 10px 30px rgba(180, 170, 160, 0.15), inset 2px 2px 4px rgba(255, 255, 255, 0.8), inset -2px -2px 4px rgba(0, 0, 0, 0.02) !important;
  transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.1) !important;
}
body.theme-clay .card .card-header, body.theme-clay .card .card-header-toggle, body.theme-clay .split-card .card-header, body.theme-clay .split-card .card-header-toggle {
  background-color: #faf8f5 !important;
  border-bottom: 1px solid #f0ece6 !important;
  color: #4b3e34 !important;
  border-radius: 28px 28px 0 0 !important;
}
body.theme-clay .card .card-body, body.theme-clay .split-card .card-body {
  color: #786b5e !important;
}
body.theme-clay .card.card-info, body.theme-clay .split-card.card-info {
  background-color: #fef3c7 !important;
  color: #92400e !important;
}
body.theme-clay .card.card-info h2, body.theme-clay .card.card-info h3, body.theme-clay .card.card-info h4, body.theme-clay .card.card-info h5, body.theme-clay .split-card.card-info h2, body.theme-clay .split-card.card-info h3, body.theme-clay .split-card.card-info h4, body.theme-clay .split-card.card-info h5 {
  color: #92400e !important;
}
body.theme-clay .card:hover, body.theme-clay .split-card:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 16px 40px rgba(180, 170, 160, 0.25) !important;
}
body.theme-clay .card:not(.recipe-card):not(.meal-slot):not(.split-card):not(.step-card):hover {
  transform: none !important;
  box-shadow: 0 10px 30px rgba(180, 170, 160, 0.15), inset 2px 2px 4px rgba(255, 255, 255, 0.8), inset -2px -2px 4px rgba(0, 0, 0, 0.02) !important;
}
body.theme-clay .separator {
  border-top: 1px solid #f0ece6 !important;
}
body.theme-clay .btn {
  border-radius: 50px !important;
  border: none !important;
  box-shadow: 0 4px 10px rgba(180, 170, 160, 0.2) !important;
}
body.theme-clay .btn:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 14px rgba(180, 170, 160, 0.3) !important;
}
body.theme-clay .btn.btn-primary {
  background: #3b82f6 !important;
}
body.theme-clay .btn.btn-success {
  background: #d97706 !important;
  color: #ffffff !important;
}
body.theme-clay .btn.btn-secondary {
  background: #ffffff !important;
  color: #4b3e34 !important;
  border: 1px solid #e5e0d8 !important;
}
body.theme-clay .btn.btn-outline-secondary {
  border: 1px solid #e5e0d8 !important;
  color: #786b5e !important;
}
body.theme-clay .form-control, body.theme-clay .form-select {
  background-color: #faf8f5 !important;
  border: 1px solid #e5e0d8 !important;
  color: #4b3e34 !important;
  border-radius: 16px !important;
  box-shadow: inset 1px 1px 3px rgba(0, 0, 0, 0.03) !important;
}
body.theme-clay .form-control:focus, body.theme-clay .form-select:focus {
  border-color: #d97706 !important;
  box-shadow: 0 0 0 4px rgba(217, 119, 6, 0.15) !important;
}
body.theme-clay .form-check-inline {
  border-radius: 16px !important;
  border: 1px solid #e5e0d8 !important;
  background-color: #faf8f5 !important;
}
body.theme-clay .form-check-input:checked {
  background-color: #d97706 !important;
  border-color: #d97706 !important;
}
body.theme-clay .list-item {
  background-color: #ffffff !important;
  border: none !important;
  border-radius: 18px !important;
  box-shadow: 0 4px 12px rgba(180, 170, 160, 0.1) !important;
}
body.theme-clay .list-item:hover {
  box-shadow: 0 8px 20px rgba(180, 170, 160, 0.18) !important;
}
body.theme-clay .pantry-item-row:hover {
  background-color: #faf8f5 !important;
}
body.theme-clay .pantry-item-row td {
  border-bottom: 1px solid #f0ece6 !important;
  color: #574c43 !important;
}
body.theme-clay .pantry-item-row .qty-btn {
  border-radius: 50% !important;
  border: 1px solid #e5e0d8 !important;
}
body.theme-clay .pantry-item-row .qty-btn:hover {
  background-color: #d97706 !important;
  color: #ffffff !important;
}
body.theme-clay .section-card {
  border-left: 6px solid #d97706 !important;
  border-radius: 8px 24px 24px 8px !important;
}
body.theme-clay .section-card .section-header {
  background: #faf8f5 !important;
  border-bottom: 1px solid #f0ece6 !important;
}
body.theme-clay .meal-plan-container .meal-slot {
  background-color: #ffffff !important;
  border-radius: 20px !important;
  box-shadow: 0 6px 18px rgba(180, 170, 160, 0.1) !important;
}
body.theme-clay .meal-plan-container .meal-slot:hover {
  box-shadow: 0 10px 24px rgba(180, 170, 160, 0.18) !important;
}
body.theme-clay .meal-plan-container .meal-slot .meal-type-title {
  border-bottom: 2px solid #faf8f5 !important;
}
body.theme-clay .meal-plan-container .meal-slot .empty-meal-btn {
  border-radius: 16px !important;
  border: 2px dashed #d97706 !important;
  background: #fdfbf7 !important;
}
body.theme-clay .meal-plan-container .meal-slot .empty-meal-btn:hover {
  background-color: #fbf8f1 !important;
}
body.theme-clay .table-recipes {
  border-radius: 18px !important;
  border: 1px solid #f0ece6 !important;
  overflow: hidden;
}
body.theme-clay .table-recipes thead tr {
  background-color: #faf8f5 !important;
}
body.theme-clay .table-recipes th, body.theme-clay .table-recipes td {
  border: 1px solid #f0ece6 !important;
}
body.theme-clay .table-recipes tbody tr:nth-child(even) {
  background-color: #fdfbf9 !important;
}
body.theme-clay .milestone {
  border: none !important;
  border-radius: 20px !important;
  background-color: #ffffff !important;
  box-shadow: 0 6px 18px rgba(180, 170, 160, 0.1) !important;
}
body.theme-clay .nav-pills .nav-link {
  border-radius: 16px !important;
}
body.theme-clay .nav-pills .nav-link:hover {
  background-color: #fef3c7 !important;
}
body.theme-clay .nav-pills .nav-link.active {
  background-color: #f3e8ff !important;
}
body.theme-clay .assistant-drawer {
  border-radius: 30px 0 0 30px !important;
  box-shadow: -10px 0px 40px rgba(180, 170, 160, 0.25) !important;
  background: #ffffff !important;
}

/* ==========================================
   Split Dashboard Cards & Floating Images
   ========================================== */
.split-card {
  height: 320px;
  background: #ffffff !important;
  border-radius: 24px !important;
  border: 1px solid #e2e8f0 !important;
  transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), box-shadow 0.4s;
  text-decoration: none;
  display: block;
  overflow: hidden;
  position: relative;
}
.split-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.08) !important;
}

.floating-card-img {
  max-height: 220px;
  max-width: 90%;
  object-fit: contain;
  filter: drop-shadow(0 12px 24px rgba(0, 0, 0, 0.08));
  transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  z-index: 2;
}

.split-card:hover .floating-card-img {
  transform: scale(1.06) translateY(-6px);
}

.arrow-icon {
  transition: transform 0.3s ease;
  opacity: 0.8;
}

.split-card:hover .arrow-icon {
  transform: translateX(8px);
  opacity: 1;
}

/* ==========================================
   Recipe Photo Filter Themes & Moderation Styling
   ========================================== */
.themed-image-container {
  position: relative;
  display: inline-block;
  width: 100%;
}
.themed-image-container .themed-image {
  transition: filter 0.3s ease, border-radius 0.3s ease, border 0.3s ease, box-shadow 0.3s ease;
}
.themed-image-container .view-original-btn, .themed-image-container .btn-report-photo {
  opacity: 0;
  transition: opacity 0.25s ease, transform 0.25s ease;
  transform: scale(0.9);
  z-index: 10;
}
.themed-image-container:hover .view-original-btn, .themed-image-container:hover .btn-report-photo {
  opacity: 0.9;
  transform: scale(1);
}
.themed-image-container:hover .view-original-btn:hover, .themed-image-container:hover .btn-report-photo:hover {
  opacity: 1;
}

body.photo-theme-comic_book .themed-image:not(.no-filter) {
  filter: contrast(1.4) grayscale(1) !important;
  border: 3px solid #000000 !important;
  border-radius: 12px !important;
}

body.photo-theme-clay .themed-image:not(.no-filter) {
  filter: saturate(1.6) contrast(1.1) blur(0.5px) !important;
  border-radius: 20px !important;
  box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.2) !important;
}

body.photo-theme-3d .themed-image:not(.no-filter) {
  filter: saturate(1.4) contrast(1.1) drop-shadow(0 4px 8px rgba(255, 100, 0, 0.15)) !important;
  border-radius: 12px !important;
}

.themed-image.no-filter {
  filter: none !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* ==========================================
   Premium UI/UX Global Classes
   ========================================== */
:root {
  --premium-shadow-sm: 0 2px 8px rgba(15, 23, 42, 0.04);
  --premium-shadow-md: 0 10px 30px rgba(15, 23, 42, 0.06);
  --premium-shadow-lg: 0 20px 40px rgba(15, 23, 42, 0.08);
}

.glass-card {
  background: rgba(255, 255, 255, 0.82) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.5) !important;
  box-shadow: var(--premium-shadow-md) !important;
  border-radius: 16px !important;
  transition: transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1), box-shadow 0.3s ease, border-color 0.3s ease;
}
.glass-card.hover-lift:hover {
  transform: translateY(-4px);
  box-shadow: var(--premium-shadow-lg) !important;
  border-color: rgba(45, 106, 79, 0.25) !important;
}

body.theme-3d .glass-card {
  background: rgba(17, 24, 39, 0.72) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3) !important;
}
body.theme-3d .glass-card.hover-lift:hover {
  border-color: rgba(45, 106, 79, 0.45) !important;
}

.check-strike-container {
  display: flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  padding: 8px 12px;
  border-radius: 8px;
  transition: background-color 0.2s ease;
}
.check-strike-container:hover {
  background-color: rgba(45, 106, 79, 0.04);
}
.check-strike-container input[type=checkbox] {
  width: 20px;
  height: 20px;
  border-radius: 6px;
  border: 2px solid #cbd5e1;
  appearance: none;
  outline: none;
  transition: all 0.2s ease;
  cursor: pointer;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.check-strike-container input[type=checkbox]:checked {
  background-color: #2d6a4f;
  border-color: #2d6a4f;
}
.check-strike-container input[type=checkbox]:checked::after {
  content: "\f26e"; /* Bootstrap Icons Check */
  font-family: "bootstrap-icons";
  color: #ffffff;
  font-size: 14px;
  font-weight: 900;
}
.check-strike-container .check-label-text {
  font-size: 1rem;
  color: #0f172a;
  transition: all 0.25s ease;
  position: relative;
}
.check-strike-container input[type=checkbox]:checked ~ .check-label-text {
  color: #64748b;
  text-decoration: line-through;
  opacity: 0.6;
}

body.theme-3d .check-strike-container:hover {
  background-color: rgba(45, 106, 79, 0.15);
}
body.theme-3d .check-strike-container .check-label-text {
  color: #f8fafc;
}
body.theme-3d .check-strike-container input[type=checkbox]:checked ~ .check-label-text {
  color: #94a3b8;
}

.stepper-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 2rem;
  position: relative;
  padding: 0 1rem;
}
.stepper-container::before {
  content: "";
  position: absolute;
  top: 24px;
  left: 10%;
  right: 10%;
  height: 4px;
  background-color: #f1f5f9;
  z-index: 1;
}
.stepper-container .step-node {
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 2;
  position: relative;
  cursor: pointer;
}
.stepper-container .step-node .step-circle {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: #ffffff;
  border: 3px solid #e2e8f0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 1.1rem;
  color: #64748b;
  transition: all 0.3s ease;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
}
.stepper-container .step-node .step-label {
  margin-top: 8px;
  font-size: 0.85rem;
  font-weight: 600;
  color: #64748b;
  transition: all 0.3s ease;
}
.stepper-container .step-node.active .step-circle {
  border-color: #2d6a4f;
  color: #2d6a4f;
  box-shadow: 0 0 0 4px rgba(45, 106, 79, 0.15);
}
.stepper-container .step-node.active .step-label {
  color: #0f172a;
  font-weight: 700;
}
.stepper-container .step-node.completed .step-circle {
  border-color: #7b2cbf;
  background-color: #7b2cbf;
  color: #ffffff;
}
.stepper-container .step-node.completed .step-label {
  color: #7b2cbf;
}

body.theme-3d .stepper-container::before {
  background-color: #1f2937;
}
body.theme-3d .stepper-container .step-node .step-circle {
  background-color: #111827;
  border-color: #374151;
  color: #94a3b8;
}
body.theme-3d .stepper-container .step-node.active .step-circle {
  border-color: #2d6a4f;
  color: #2d6a4f;
}
body.theme-3d .stepper-container .step-node.active .step-label {
  color: #f8fafc;
}

.premium-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 3.5rem 2rem;
  text-align: center;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.45);
  border: 2px dashed #cbd5e1;
}
.premium-empty-state .empty-icon {
  font-size: 3.5rem;
  color: #2d6a4f;
  opacity: 0.7;
  margin-bottom: 1.25rem;
  animation: float-y 3s infinite ease-in-out;
}
.premium-empty-state h4 {
  font-weight: 700;
  color: #0f172a;
}

body.theme-3d .premium-empty-state {
  background: rgba(17, 24, 39, 0.45);
  border-color: #374151;
}
body.theme-3d .premium-empty-state h4 {
  color: #f8fafc;
}

/* ==========================================
   SaaS App Shell Navigation & Layouts
   ========================================== */
.app-shell-container {
  height: 100vh;
  width: 100vw;
  overflow: hidden;
}

.app-sidebar {
  width: 280px;
  background-color: #ffffff;
  border-right: 1px solid #e2e8f0;
  transition: all 0.3s ease;
  z-index: 101;
}
.app-sidebar .sidebar-logo span {
  font-size: 1.3rem !important;
  font-weight: 850 !important;
}
.app-sidebar .nav-link {
  font-size: 0.92rem;
  font-weight: 600;
  color: #475569 !important;
  border-radius: 10px;
  transition: all 0.2s ease;
}
.app-sidebar .nav-link:hover {
  background-color: #edf7f4 !important;
  color: #2d6a4f !important;
}
.app-sidebar .nav-link.active {
  background-color: #edf7f4 !important;
  color: #2d6a4f !important;
  font-weight: 700;
  border: 1px solid rgba(45, 106, 79, 0.1);
}
.app-sidebar .profile-dropdown {
  border-radius: 12px;
  transition: background-color 0.2s ease;
}
.app-sidebar .profile-dropdown:hover {
  background-color: #f8fafc;
}

@media (min-width: 768px) {
  #sidebar-container {
    width: 280px;
    transition: width 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  }
  #sidebar-container.collapsed {
    width: 72px;
  }
  #sidebar-container.collapsed .app-sidebar {
    width: 100% !important;
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
  }
  #sidebar-container.collapsed .app-sidebar .sidebar-logo {
    justify-content: center !important;
    padding: 0.25rem 0 !important;
  }
  #sidebar-container.collapsed .app-sidebar .sidebar-logo span {
    display: none !important;
  }
  #sidebar-container.collapsed .app-sidebar .sidebar-logo::after {
    content: "T";
    font-size: 1.5rem;
    font-weight: 850;
    color: #2d6a4f;
    display: block;
  }
  body.theme-3d #sidebar-container.collapsed .app-sidebar .sidebar-logo::after {
    color: #d8b4fe;
  }
  body.theme-comic_book #sidebar-container.collapsed .app-sidebar .sidebar-logo::after {
    color: #000000;
  }
  #sidebar-container.collapsed .app-sidebar hr {
    margin-left: -0.5rem;
    margin-right: -0.5rem;
  }
  #sidebar-container.collapsed .app-sidebar .nav-link {
    padding-left: 0 !important;
    padding-right: 0 !important;
    justify-content: center !important;
  }
  #sidebar-container.collapsed .app-sidebar .nav-link span {
    display: none !important;
  }
  #sidebar-container.collapsed .app-sidebar .nav-link i {
    margin-right: 0 !important;
    font-size: 1.3rem !important;
  }
  #sidebar-container.collapsed .app-sidebar .profile-dropdown {
    justify-content: center !important;
    padding: 0.5rem 0 !important;
  }
  #sidebar-container.collapsed .app-sidebar .profile-dropdown strong {
    display: none !important;
  }
  #sidebar-container.collapsed .app-sidebar .profile-dropdown i {
    margin-right: 0 !important;
    font-size: 1.5rem !important;
  }
  #sidebar-container.collapsed .app-sidebar .profile-dropdown::after {
    display: none !important;
  }
  #sidebar-container .app-sidebar {
    width: 100% !important;
  }
}
.workspace-frame {
  background-color: #f8fafc;
}

.app-topbar {
  background-color: #ffffff;
  border-bottom: 1px solid #e2e8f0;
  min-height: 60px;
}

/* ==========================================
   Ellipsis Dropdown Context Menus
   ========================================== */
.dropdown-ellipsis {
  position: relative;
}
.dropdown-ellipsis .btn-ellipsis {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #64748b;
  background: transparent;
  border: none;
  transition: all 0.2s ease;
  outline: none;
}
.dropdown-ellipsis .btn-ellipsis:hover {
  background-color: #f1f5f9;
  color: #0f172a;
}
.dropdown-ellipsis .dropdown-menu {
  border: 1px solid rgba(0, 0, 0, 0.05) !important;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08) !important;
  border-radius: 12px !important;
  padding: 6px !important;
}
.dropdown-ellipsis .dropdown-menu .dropdown-item {
  border-radius: 8px !important;
  padding: 6px 12px !important;
  font-size: 0.88rem !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: #334155;
}
.dropdown-ellipsis .dropdown-menu .dropdown-item:hover {
  background-color: #f1f5f9;
  color: #0f172a;
}

/* ==========================================
   Kanban-style Weekly Meal Plan Board (Trello Redesign)
   ========================================== */
.meal-plan-canvas {
  transition: all 0.3s ease;
  min-height: 650px;
}
body.theme-lifelike .meal-plan-canvas {
  background: linear-gradient(135deg, #e2f1db 0%, #cce3c4 100%);
  border: 1px solid rgba(45, 106, 79, 0.1);
}
body.theme-3d .meal-plan-canvas {
  background: linear-gradient(135deg, #0f172a 0%, #1e1b4b 100%);
  border: 1px solid rgba(255, 255, 255, 0.05);
}
body.theme-comic_book .meal-plan-canvas {
  background-color: #fafaf9;
  background-image: radial-gradient(#d6d3d1 1.5px, transparent 1.5px);
  background-size: 24px 24px;
  border: 3px solid #000000;
}
body.theme-clay .meal-plan-canvas {
  background: #e2e8f0;
  box-shadow: inset 8px 8px 16px #cbd5e1, inset -8px -8px 16px #ffffff;
  border: none;
}

.meal-plan-board {
  display: flex;
  gap: 20px;
  overflow-x: auto;
  padding: 8px 4px 20px 4px;
  min-height: 600px;
  scroll-behavior: smooth;
  align-items: flex-start;
}
.meal-plan-board .board-column {
  flex: 1 0 290px;
  max-width: 320px;
  border-radius: 16px;
  padding: 16px 12px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  transition: all 0.3s ease;
}
body.theme-lifelike .meal-plan-board .board-column {
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.6);
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.03);
}
body.theme-lifelike .meal-plan-board .board-column:hover {
  background: rgba(255, 255, 255, 0.85);
  box-shadow: 0 10px 20px rgba(15, 23, 42, 0.06);
}
body.theme-3d .meal-plan-board .board-column {
  background: rgba(30, 41, 59, 0.55);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.04);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}
body.theme-3d .meal-plan-board .board-column:hover {
  background: rgba(30, 41, 59, 0.7);
  border-color: rgba(255, 255, 255, 0.08);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.25);
}
body.theme-comic_book .meal-plan-board .board-column {
  background: #ffffff;
  border: 3px solid #000000;
  box-shadow: 5px 5px 0px #000000;
  border-radius: 0px;
}
body.theme-comic_book .meal-plan-board .board-column:hover {
  transform: translate(-2px, -2px);
  box-shadow: 7px 7px 0px #000000;
}
body.theme-clay .meal-plan-board .board-column {
  background: #f1f5f9;
  border-radius: 20px;
  box-shadow: 6px 6px 12px #cbd5e1, -6px -6px 12px #ffffff;
  border: none;
}
body.theme-clay .meal-plan-board .board-column:hover {
  box-shadow: 10px 10px 20px #cbd5e1, -10px -10px 20px #ffffff;
}
.meal-plan-board .board-column .column-header {
  font-weight: 700;
  font-size: 0.95rem;
  padding-bottom: 8px;
  border-bottom: 2px solid rgba(0, 0, 0, 0.04);
}
body.theme-3d .meal-plan-board .board-column .column-header {
  color: #f8fafc;
  border-bottom-color: rgba(255, 255, 255, 0.05);
}
body.theme-comic_book .meal-plan-board .board-column .column-header {
  border-bottom: 3px solid #000000;
  font-family: "Comic Sans MS", cursive, sans-serif;
}

.meal-slot {
  display: flex;
  flex-direction: column;
  gap: 8px;
  background: rgba(0, 0, 0, 0.015);
  border-radius: 12px;
  padding: 8px;
  border: 1px dashed rgba(0, 0, 0, 0.04);
}
body.theme-3d .meal-slot {
  background: rgba(255, 255, 255, 0.01);
  border-color: rgba(255, 255, 255, 0.02);
}
body.theme-comic_book .meal-slot {
  border: 2px dashed #000000;
  border-radius: 0;
  background: transparent;
}

.meal-type-title {
  color: #64748b;
  font-weight: 700;
}
body.theme-3d .meal-type-title {
  color: #94a3b8;
}
body.theme-comic_book .meal-type-title {
  color: #000000;
  font-family: "Comic Sans MS", cursive, sans-serif;
}

.trello-meal-card {
  position: relative;
  border-radius: 12px;
  transition: all 0.25s cubic-bezier(0.165, 0.84, 0.44, 1);
  display: flex;
  flex-direction: column;
  z-index: 1;
}
body.theme-lifelike .trello-meal-card {
  background: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.05);
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.03);
}
body.theme-lifelike .trello-meal-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.08);
  border-color: rgba(45, 106, 79, 0.2);
}
body.theme-3d .trello-meal-card {
  background: #1e293b;
  border: 1px solid rgba(255, 255, 255, 0.05);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  color: #f8fafc;
}
body.theme-3d .trello-meal-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.35);
  border-color: rgba(255, 255, 255, 0.12);
}
body.theme-comic_book .trello-meal-card {
  background: #ffffff;
  border: 2px solid #000000;
  box-shadow: 3px 3px 0px #000000;
  border-radius: 0px;
}
body.theme-comic_book .trello-meal-card:hover {
  transform: translate(-1px, -1px);
  box-shadow: 4px 4px 0px #000000;
}
body.theme-clay .trello-meal-card {
  background: #f1f5f9;
  border-radius: 16px;
  box-shadow: 3px 3px 6px #cbd5e1, -3px -3px 6px #ffffff;
}
body.theme-clay .trello-meal-card:hover {
  box-shadow: 6px 6px 12px #cbd5e1, -6px -6px 12px #ffffff;
  transform: scale(1.02);
}
.trello-meal-card .card-cover-img {
  height: 110px;
  overflow: hidden;
  position: relative;
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
}
.trello-meal-card .card-cover-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}
.trello-meal-card .card-cover-img:hover img {
  transform: scale(1.06);
}
.trello-meal-card .trello-card-content {
  padding: 12px;
}
.trello-meal-card .trello-card-title {
  font-size: 0.88rem;
  font-weight: 700;
  line-height: 1.3;
}
.trello-meal-card .trello-card-title a {
  color: #0f172a;
}
body.theme-3d .trello-meal-card .trello-card-title a {
  color: #f8fafc;
}
body.theme-comic_book .trello-meal-card .trello-card-title a {
  color: #000000;
}
.trello-meal-card .btn-ellipsis {
  transition: all 0.2s ease;
}
.trello-meal-card .btn-ellipsis:hover {
  background: #edf7f4 !important;
  color: #2d6a4f !important;
}
body.theme-3d .trello-meal-card .btn-ellipsis {
  background: rgba(255, 255, 255, 0.05) !important;
  color: #94a3b8 !important;
}
body.theme-3d .trello-meal-card .btn-ellipsis:hover {
  background: rgba(255, 255, 255, 0.12) !important;
  color: #ffffff !important;
}

.empty-meal-btn {
  border-radius: 8px;
  font-size: 0.78rem;
  font-weight: 600;
  color: #64748b;
  transition: all 0.2s ease;
  background: transparent;
  border: 1px dashed transparent;
}
.empty-meal-btn .plus-icon {
  font-size: 1rem;
  line-height: 1;
  margin-right: 2px;
}
.empty-meal-btn:hover {
  background: rgba(0, 0, 0, 0.03);
  color: #2d6a4f;
  border-color: rgba(45, 106, 79, 0.15);
}
body.theme-3d .empty-meal-btn {
  color: #94a3b8;
}
body.theme-3d .empty-meal-btn:hover {
  background: rgba(255, 255, 255, 0.03);
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.08);
}
body.theme-comic_book .empty-meal-btn {
  border: 2px dashed #000000;
  border-radius: 0px;
  color: #000000;
}
body.theme-comic_book .empty-meal-btn:hover {
  background: #edf7f4;
}
body.theme-clay .empty-meal-btn {
  box-shadow: inset 2px 2px 5px #cbd5e1, inset -2px -2px 5px #ffffff;
  border-radius: 12px;
}
body.theme-clay .empty-meal-btn:hover {
  background: rgba(45, 106, 79, 0.05);
}

.member-avatar {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  color: #ffffff;
  border: 1.5px solid #ffffff;
  margin-left: -8px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  position: relative;
  z-index: 1;
  transition: transform 0.2s ease, z-index 0.2s ease;
  background-color: #7b2cbf;
}
.member-avatar:nth-child(2n) {
  background-color: #2d6a4f;
}
.member-avatar:nth-child(3n) {
  background-color: #0ea5e9;
}
.member-avatar:hover {
  transform: translateY(-4px) scale(1.15);
  z-index: 5;
}
body.theme-3d .member-avatar {
  border-color: #1e293b;
}
body.theme-comic_book .member-avatar {
  border: 2px solid #000000;
  border-radius: 0px;
  box-shadow: none;
  margin-left: -4px;
}

/* ==========================================
   Sleek Dark Mode (theme-3d) App Shell Overrides
   ========================================== */
body.theme-3d .app-sidebar {
  background-color: #111827 !important;
  border-color: #1f2937 !important;
}
body.theme-3d .app-sidebar .nav-link {
  color: #94a3b8 !important;
}
body.theme-3d .app-sidebar .nav-link:hover {
  background-color: rgba(45, 106, 79, 0.15) !important;
  color: #2d6a4f !important;
}
body.theme-3d .app-sidebar .nav-link.active {
  background-color: rgba(123, 44, 191, 0.15) !important;
  color: #d8b4fe !important;
  border-color: rgba(123, 44, 191, 0.25);
}
body.theme-3d .app-sidebar .profile-dropdown:hover {
  background-color: #1f2937;
}
body.theme-3d .workspace-frame {
  background-color: #0b0f19;
}
body.theme-3d .app-topbar {
  background-color: #111827 !important;
  border-color: #1f2937 !important;
}
body.theme-3d .dropdown-ellipsis .btn-ellipsis {
  color: #94a3b8;
}
body.theme-3d .dropdown-ellipsis .btn-ellipsis:hover {
  background-color: #1f2937;
  color: #f8fafc;
}
body.theme-3d .dropdown-ellipsis .dropdown-menu {
  background-color: #111827 !important;
  border-color: #1f2937 !important;
}
body.theme-3d .dropdown-ellipsis .dropdown-menu .dropdown-item {
  color: #cbd5e1;
}
body.theme-3d .dropdown-ellipsis .dropdown-menu .dropdown-item:hover {
  background-color: #1f2937;
  color: #f8fafc;
}

/* ==========================================
   Theater Mode for Immersive Cooking Mode
   ========================================== */
body.theater-mode-active {
  overflow: hidden !important;
}
body.theater-mode-active .navbar, body.theater-mode-active .app-sidebar, body.theater-mode-active .app-topbar, body.theater-mode-active footer {
  display: none !important;
}
body.theater-mode-active .app-shell-container {
  height: 100vh !important;
  width: 100vw !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
}
body.theater-mode-active .workspace-frame {
  height: 100vh !important;
  width: 100vw !important;
  overflow: hidden !important;
  background: radial-gradient(circle at center, #1e293b 0%, #0f172a 100%) !important;
  padding: 0 !important;
  margin: 0 !important;
}
body.theater-mode-active main {
  height: 100vh !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex;
  align-items: center;
  justify-content: center;
}
body.theater-mode-active main .container, body.theater-mode-active main .container-fluid {
  max-width: 100% !important;
  width: 100% !important;
  height: 100% !important;
  padding: 40px !important;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
body.theater-mode-active .cooking-header h2 {
  font-size: 2.2rem !important;
  font-weight: 800;
  color: #ffffff !important;
  text-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}
body.theater-mode-active .cooking-screen {
  flex-grow: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}
body.theater-mode-active .cooking-screen .card {
  background: rgba(255, 255, 255, 0.05) !important;
  backdrop-filter: blur(25px) !important;
  -webkit-backdrop-filter: blur(25px) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 30px 60px rgba(0, 0, 0, 0.4) !important;
  width: 100%;
  max-width: 950px;
  border-radius: 24px !important;
}
body.theater-mode-active .cooking-screen .card .card-header {
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  background: transparent;
}
body.theater-mode-active .cooking-screen .card .card-header h3 {
  font-size: 1.8rem;
  color: #10b981 !important;
  font-weight: 700;
}
body.theater-mode-active .cooking-screen .card .card-body {
  padding: 60px 40px !important;
  color: #f8fafc !important;
}
body.theater-mode-active .cooking-screen .card .card-body .step-description {
  font-size: 2.4rem !important;
  line-height: 1.45 !important;
  font-weight: 600 !important;
  color: #ffffff !important;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}
body.theater-mode-active .cooking-screen .card .card-body img {
  max-height: 380px !important;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.3);
  border: 1px solid rgba(255, 255, 255, 0.1);
}
body.theater-mode-active .cooking-screen .card .card-body h5 {
  color: #10b981 !important;
}
body.theater-mode-active .cooking-screen .card .card-body .list-group-item {
  background: transparent !important;
  color: #e2e8f0 !important;
  border-bottom-color: rgba(255, 255, 255, 0.05) !important;
  font-size: 1.15rem;
}
body.theater-mode-active .cooking-screen .card .card-body .list-group-item .badge {
  background-color: rgba(255, 255, 255, 0.1) !important;
  color: #cbd5e1 !important;
}
body.theater-mode-active .cooking-screen .card .card-body .list-group-item span.fw-semibold {
  color: #ffffff !important;
}
body.theater-mode-active #btn-prev, body.theater-mode-active #btn-next {
  font-size: 1.3rem !important;
  padding: 16px 36px !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3) !important;
}
body.theater-mode-active #btn-next {
  background-color: #10b981 !important;
  border-color: #10b981 !important;
}
body.theater-mode-active #btn-next:hover {
  background-color: #059669 !important;
}
body.theater-mode-active #btn-prev {
  background-color: rgba(255, 255, 255, 0.1) !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  color: #ffffff !important;
}
body.theater-mode-active #btn-prev:hover {
  background-color: rgba(255, 255, 255, 0.2) !important;
}
body.theater-mode-active .progress {
  height: 20px !important;
  background-color: rgba(255, 255, 255, 0.05) !important;
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.2) !important;
}
body.theater-mode-active .progress .progress-bar {
  background-color: #10b981 !important;
  font-size: 0.85rem !important;
  line-height: 20px !important;
}

@keyframes float-y {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-8px);
  }
}
/* ==========================================
   Mobile UI/UX Optimization Refinements
   ========================================== */
@media (max-width: 767.98px) {
  #sidebar-container.mobile-sidebar-active {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10040;
    width: 280px;
    height: 100vh;
    box-shadow: 4px 0 15px rgba(0, 0, 0, 0.2);
    display: block !important;
  }
}
.mobile-day-selector .mobile-day-tab-btn {
  transition: all 0.2s ease;
  border-radius: 8px;
  background: transparent;
  border: none;
}
.mobile-day-selector .mobile-day-tab-btn.bg-white {
  background-color: #ffffff !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08) !important;
}

@media (max-width: 767.98px) {
  .meal-plan-board {
    display: block !important;
    overflow-x: hidden !important;
    padding: 0 !important;
    min-height: auto !important;
  }
  .board-column {
    display: none !important;
    max-width: 100% !important;
    width: 100% !important;
    flex: none !important;
    margin-bottom: 20px;
  }
  .board-column.active-mobile-column {
    display: flex !important;
  }
}
/* Premium Top Navbar Styles */
.premium-navbar {
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  background-color: rgba(255, 255, 255, 0.85);
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  z-index: 1030;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.02);
}
body.theme-3d .premium-navbar {
  background-color: rgba(17, 24, 39, 0.85);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
}
body.theme-comic_book .premium-navbar {
  background-color: #ffffff;
  border-bottom: 3px solid #000000;
  box-shadow: none;
}
body.theme-clay .premium-navbar {
  background-color: rgba(241, 245, 249, 0.85);
  border-bottom: none;
  box-shadow: inset 0 -2px 5px rgba(0, 0, 0, 0.02), 0 4px 10px rgba(0, 0, 0, 0.04);
}
.premium-navbar .navbar-brand {
  font-size: 1.2rem;
  font-weight: 850 !important;
  letter-spacing: 0.5px;
}
body.theme-3d .premium-navbar .navbar-brand {
  color: #f8fafc !important;
}
.premium-navbar .nav-link {
  font-size: 0.92rem;
  font-weight: 600;
  color: #475569 !important;
  padding: 0.5rem 1rem !important;
  border-radius: 20px;
  transition: all 0.2s ease;
}
.premium-navbar .nav-link:hover {
  background-color: #edf7f4 !important;
  color: #2d6a4f !important;
}
body.theme-3d .premium-navbar .nav-link:hover {
  background-color: rgba(45, 106, 79, 0.15) !important;
  color: #2d6a4f !important;
}
.premium-navbar .nav-link.active {
  background-color: #edf7f4 !important;
  color: #2d6a4f !important;
  font-weight: 700;
}
body.theme-3d .premium-navbar .nav-link.active {
  background-color: rgba(123, 44, 191, 0.15) !important;
  color: #d8b4fe !important;
}
.premium-navbar .profile-dropdown-pill {
  transition: all 0.2s ease;
  border-color: rgba(0, 0, 0, 0.08) !important;
  color: #475569 !important;
}
.premium-navbar .profile-dropdown-pill:hover {
  background-color: #f8fafc !important;
  border-color: rgba(0, 0, 0, 0.15) !important;
}
body.theme-3d .premium-navbar .profile-dropdown-pill {
  background-color: #1e293b !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  color: #f8fafc !important;
}
body.theme-3d .premium-navbar .profile-dropdown-pill:hover {
  background-color: #1f2937 !important;
}

/*# sourceMappingURL=styles.css.map */