:root {
  --fudge: #56372c;
  --fudge-dark: #3d251e;
  --caramel: #bd7548;
  --cream: #f8f3ed;
  --ink: #2f2926;
}

body { background: #f7f5f2; color: var(--ink); min-height: 100vh; }
.app-navbar { background: linear-gradient(110deg, var(--fudge-dark), var(--fudge)); }
.navbar-brand { font-weight: 750; letter-spacing: -.02em; }
.navbar .nav-link { border-radius: .55rem; color: rgba(255,255,255,.7); padding-inline: .75rem !important; }
.navbar .nav-link:hover, .navbar .nav-link.active { background: rgba(255,255,255,.1); color: #fff; }
.brand-mark { align-items: center; background: var(--caramel); border-radius: .65rem; display: inline-flex; height: 2rem; justify-content: center; width: 2rem; }
.brand-mark-lg { font-size: 1.25rem; height: 2.75rem; width: 2.75rem; }
.page-heading h1 { font-size: clamp(1.8rem, 4vw, 2.5rem); font-weight: 760; letter-spacing: -.035em; }
.eyebrow { color: var(--caramel); font-size: .72rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.btn { border-radius: .65rem; font-weight: 600; }
.btn-primary { --bs-btn-bg: var(--fudge); --bs-btn-border-color: var(--fudge); --bs-btn-hover-bg: var(--fudge-dark); --bs-btn-hover-border-color: var(--fudge-dark); --bs-btn-active-bg: var(--fudge-dark); }
.card { border-radius: 1rem; }
.card-header:first-child { border-radius: 1rem 1rem 0 0; }
.form-control, .form-select, .input-group-text { border-radius: .65rem; min-height: 2.75rem; }
.input-group > :not(:first-child) { border-bottom-left-radius: 0; border-top-left-radius: 0; }
.input-group > :not(:last-child) { border-bottom-right-radius: 0; border-top-right-radius: 0; }
.form-control:focus, .form-select:focus { border-color: #bd7548; box-shadow: 0 0 0 .2rem rgba(189,117,72,.15); }
.table > :not(caption) > * > * { padding: 1rem 1.25rem; }
.table thead th { background: #f4f0eb; color: #706760; font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; }
.table-link, .back-link { color: var(--fudge); font-weight: 700; text-decoration: none; }
.table-link:hover, .back-link:hover { color: var(--caramel); }
.metric-card .card-body { padding: 1.4rem; }
.metric-icon, .recipe-icon { align-items: center; border-radius: .8rem; display: inline-flex; font-size: 1.25rem; height: 2.75rem; justify-content: center; width: 2.75rem; }
.recipe-icon { background: var(--cream); color: var(--caramel); }
.bg-caramel-soft { background: #f6e9df; }.text-caramel { color: #a75e35; }
.metric-value { font-size: 2rem; font-weight: 760; line-height: 1.1; }
.date-tile { align-items: center; background: var(--cream); border-radius: .7rem; display: flex; flex: 0 0 3rem; flex-direction: column; height: 3rem; justify-content: center; line-height: 1; }
.date-tile span { color: var(--caramel); font-size: .65rem; font-weight: 800; text-transform: uppercase; }.date-tile strong { font-size: 1.15rem; }
.stock-dot { border-radius: 50%; flex: 0 0 .6rem; height: .6rem; width: .6rem; }
.empty-state { padding: 3rem 1.5rem; text-align: center; }.empty-state > i { color: #a99e96; display: block; font-size: 2rem; margin-bottom: .75rem; }
.recipe-description { min-height: 3rem; }.ingredient-row { background: #faf8f6; border: 1px solid #eee8e2; border-radius: .8rem; padding: .65rem; }
.forecast-order { background: #faf8f6; border: 1px solid #eee8e2; border-radius: .8rem; padding: .8rem; transition: .15s ease; }.forecast-order:hover { border-color: #d8c7bb; transform: translateY(-1px); }
.cost-summary { background: var(--cream); border: 1px solid #eadfd5; border-radius: .9rem; padding: 1rem 1.25rem; }
.batch-check { width: 3rem; }
@media print {
  body { background: #fff; }
  .app-navbar, .mobile-tabbar, .mobile-offcanvas, .no-print, .toast-container { display: none !important; }
  main.container-xl { max-width: none; padding: 0 !important; }
  .batch-sheet .card { break-inside: avoid; box-shadow: none !important; border: 1px solid #ddd !important; }
  .batch-sheet .table { font-size: .85rem; }
}
.badge { font-weight: 700; padding: .45em .7em; }.status-draft { background: #e8e9eb; color: #4f555b; }.status-confirmed { background: #dceef8; color: #185d83; }.status-completed { background: #dff2e8; color: #17653b; }.status-cancelled { background: #f6dfdf; color: #8b2828; }
.login-shell { background: radial-gradient(circle at 10% 10%, #8d5a43, transparent 35%), linear-gradient(135deg, #32201a, #694538); min-height: 100vh; }
.login-card { max-width: 940px; width: 100%; }.login-panel { background: linear-gradient(145deg, rgba(86,55,44,.96), rgba(61,37,30,.98)), radial-gradient(circle, #bd7548, transparent); min-height: 520px; }
@media (max-width: 767.98px) { .login-panel { min-height: 250px; }.page-heading .btn { white-space: nowrap; }.table > :not(caption) > * > * { padding: .85rem; } }

html { -webkit-text-size-adjust: 100%; }
body { overscroll-behavior-y: none; -webkit-tap-highlight-color: transparent; }
button, .btn, a, input, select, textarea { touch-action: manipulation; }
.toast-container { z-index: 1090; }
.mobile-menu-button { color: #fff; font-size: 1.5rem; height: 44px; padding: 0; width: 44px; }
.mobile-menu-button:hover, .mobile-menu-button:focus { background: rgba(255,255,255,.1); color: #fff; }
.mobile-offcanvas { --bs-offcanvas-width: min(88vw, 360px); }
.mobile-offcanvas .offcanvas-header { border-bottom: 1px solid #eee8e2; padding: calc(1rem + env(safe-area-inset-top)) 1.25rem 1rem; }
.mobile-offcanvas .offcanvas-body { padding-bottom: calc(1rem + env(safe-area-inset-bottom)); }
.mobile-menu-list a { align-items: center; border-radius: .85rem; color: var(--ink); display: flex; gap: .9rem; min-height: 62px; padding: .65rem .8rem; text-decoration: none; }
.mobile-menu-list a > i:first-child { align-items: center; background: var(--cream); border-radius: .7rem; color: var(--caramel); display: inline-flex; flex: 0 0 2.5rem; font-size: 1.15rem; height: 2.5rem; justify-content: center; }
.mobile-menu-list a span { display: flex; flex-direction: column; }.mobile-menu-list a small { color: #766d67; }.mobile-menu-list a.active { background: #f4ece6; }.mobile-menu-list a.active > i:first-child { background: var(--fudge); color: #fff; }
.mobile-tabbar { align-items: flex-start; background: rgba(255,255,255,.96); border-top: 1px solid #e6ded8; bottom: 0; box-shadow: 0 -.25rem 1.25rem rgba(61,37,30,.09); display: flex; height: calc(64px + env(safe-area-inset-bottom)); justify-content: space-around; left: 0; padding: .35rem .25rem env(safe-area-inset-bottom); position: fixed; right: 0; z-index: 1050; }
.mobile-tabbar a, .mobile-tabbar button { align-items: center; background: transparent; border: 0; color: #7e746e; display: flex; flex: 1; flex-direction: column; font-size: .67rem; font-weight: 700; gap: .1rem; justify-content: center; min-height: 50px; padding: 0 .2rem; text-decoration: none; }
.mobile-tabbar i { font-size: 1.25rem; line-height: 1.2; }.mobile-tabbar .active { color: var(--fudge); }.mobile-tabbar .tabbar-primary i { align-items: center; background: var(--fudge); border-radius: 50%; color: #fff; display: inline-flex; height: 2.35rem; justify-content: center; margin-top: -.9rem; width: 2.35rem; }.mobile-tabbar .tabbar-primary.active i { background: var(--caramel); }

@media (max-width: 991.98px) {
  body { padding-bottom: calc(64px + env(safe-area-inset-bottom)); }
  .app-navbar { padding-top: calc(.5rem + env(safe-area-inset-top)); }
  .app-main { padding: 1.25rem .85rem 2rem !important; }
  .btn:not(.btn-close) { min-height: 44px; }
  .btn-sm:not(.btn-close) { min-height: 40px; min-width: 40px; }
  .form-control, .form-select { font-size: 16px; min-height: 48px; }
  .input-group-text { min-height: 48px; }
  .form-check-input { height: 1.25rem; width: 1.25rem; }
  .form-check-label { min-height: 28px; padding-left: .2rem; }
  .card { border-radius: .9rem; }
  .table-responsive { -webkit-overflow-scrolling: touch; }
  .toast-container { left: 0; margin-top: calc(3.5rem + env(safe-area-inset-top)) !important; padding: .75rem !important; right: 0; width: 100%; }
  .toast-container .toast { margin-left: auto; max-width: 420px; width: 100%; }
}

@media (max-width: 767.98px) {
  .page-heading { align-items: stretch !important; display: flex !important; flex-direction: column !important; }
  .page-heading > .btn, .page-heading > a.btn { margin-top: .25rem; width: 100%; }
  .page-heading > .d-flex { flex-wrap: wrap; width: 100%; }
  .page-heading > .d-flex form { flex: 1 1 100%; }.page-heading > .d-flex form .btn { width: 100%; }
  .card-body.p-4, .card-body.p-5, .card-body.p-lg-5 { padding: 1rem !important; }
  .card-header.px-4 { padding-left: 1rem !important; padding-right: 1rem !important; }
  .card-footer.p-4 { padding: 1rem !important; }
  .card-footer.d-flex { flex-wrap: wrap; }.card-footer.d-flex > .btn, .card-footer.d-flex > form { flex: 1 1 auto; }.card-footer.d-flex > form .btn { width: 100%; }
  .display-5, .display-6 { font-size: 2rem; }
  .empty-state { padding: 2.25rem 1rem; }
  .ingredient-row { padding: .75rem; position: relative; }
  .ingredient-row > .col, .ingredient-row > [class*="col-"]:not(.col-auto) { flex: 0 0 100%; max-width: 100%; width: 100%; }
  .ingredient-row > .col:first-child { padding-right: 3.25rem; }
  .ingredient-row > .col-auto { position: absolute; right: .6rem; top: .55rem; }
  .cost-summary { align-items: flex-start !important; flex-direction: column; gap: .5rem; }
  .login-shell { min-height: 100dvh; padding: env(safe-area-inset-top) .75rem env(safe-area-inset-bottom) !important; }
  .login-card { border-radius: 1rem; }.login-panel { min-height: 205px; padding: 1.5rem !important; }.login-panel .display-6 { font-size: 1.75rem; }.login-card .col-md-7 { padding: 1.5rem !important; }

  .table-responsive:has(.mobile-table) { overflow: visible; }
  .mobile-table, .mobile-table tbody { display: block; width: 100%; }
  .mobile-table thead { display: none; }
  .mobile-table tr { background: #fff; border: 1px solid #e9e2dc; border-radius: .8rem; display: block; margin: .75rem; overflow: hidden; padding: .35rem .85rem; }
  .mobile-table td { align-items: center; background: transparent !important; border: 0; border-bottom: 1px solid #f0ebe7; display: flex; gap: 1rem; justify-content: space-between; min-height: 44px; padding: .6rem 0 !important; text-align: right !important; }
  .mobile-table td:last-child { border-bottom: 0; }.mobile-table td::before { color: #7a7069; content: ""; flex: 0 0 38%; font-size: .7rem; font-weight: 800; letter-spacing: .04em; text-align: left; text-transform: uppercase; }.mobile-table td > :only-child { margin-left: auto; }.mobile-table td[colspan] { display: block; }.mobile-table td[colspan]::before { display: none; }
  .mobile-table .empty-state { text-align: center; }

  .ingredients-table td:nth-child(1)::before { content: "Ingredient"; }.ingredients-table td:nth-child(2)::before { content: "Current stock"; }.ingredients-table td:nth-child(3)::before { content: "Reorder at"; }.ingredients-table td:nth-child(4)::before { content: "Average cost"; }.ingredients-table td:nth-child(5)::before { content: "Stock value"; }.ingredients-table td:nth-child(6)::before { content: "Status"; }.ingredients-table td:nth-child(7)::before { content: "Actions"; }
  .orders-table td:nth-child(1)::before { content: "Order"; }.orders-table td:nth-child(2)::before { content: "Customer"; }.orders-table td:nth-child(3)::before { content: "Due"; }.orders-table td:nth-child(4)::before { content: "Items"; }.orders-table td:nth-child(5)::before { content: "Ingredient cost"; }.orders-table td:nth-child(6)::before { content: "Status"; }.orders-table td:nth-child(7)::before { content: "Open"; }
  .forecast-table td:nth-child(1)::before { content: "Ingredient"; }.forecast-table td:nth-child(2)::before { content: "Current"; }.forecast-table td:nth-child(3)::before { content: "Committed"; }.forecast-table td:nth-child(4)::before { content: "Predicted"; }.forecast-table td:nth-child(5)::before { content: "Average cost"; }.forecast-table td:nth-child(6)::before { content: "Value"; }.forecast-table td:nth-child(7)::before { content: "Buy by"; }.forecast-table td:nth-child(8)::before { content: "Position"; }
  .timeline-table td:nth-child(1)::before { content: "Start by"; }.timeline-table td:nth-child(2)::before { content: "Recipe"; }.timeline-table td:nth-child(3)::before { content: "Order"; }.timeline-table td:nth-child(4)::before { content: "Customer"; }.timeline-table td:nth-child(5)::before { content: "Quantity"; }.timeline-table td:nth-child(6)::before { content: "Due"; }.timeline-table td:nth-child(7)::before { content: "Status"; }
  .batch-orders-table td:nth-child(1)::before { content: "Select"; }.batch-orders-table td:nth-child(2)::before { content: "Order"; }.batch-orders-table td:nth-child(3)::before { content: "Customer"; }.batch-orders-table td:nth-child(4)::before { content: "Due"; }.batch-orders-table td:nth-child(5)::before { content: "Required"; }.batch-orders-table td:nth-child(6)::before { content: "Est. cost"; }
  .batch-ingredients-table td:nth-child(1)::before { content: "Ingredient"; }.batch-ingredients-table td:nth-child(2)::before { content: "Required"; }.batch-ingredients-table td:nth-child(3)::before { content: "In stock"; }.batch-ingredients-table td:nth-child(4)::before { content: "After batch"; }.batch-ingredients-table td:nth-child(5)::before { content: "Est. cost"; }.batch-ingredients-table td:nth-child(6)::before { content: "Check"; }
  .batch-included-table td:nth-child(1)::before { content: "Order"; }.batch-included-table td:nth-child(2)::before { content: "Customer"; }.batch-included-table td:nth-child(3)::before { content: "Due"; }.batch-included-table td:nth-child(4)::before { content: "Quantity"; }
  .lots-table td:nth-child(1)::before { content: "Received"; }.lots-table td:nth-child(2)::before { content: "Source"; }.lots-table td:nth-child(3)::before { content: "Best before"; }.lots-table td:nth-child(4)::before { content: "Remaining"; }.lots-table td:nth-child(5)::before { content: "Unit cost"; }.lots-table td:nth-child(6)::before { content: "Value"; }
  .movements-table td:nth-child(1)::before { content: "Date"; }.movements-table td:nth-child(2)::before { content: "Reason"; }.movements-table td:nth-child(3)::before { content: "Change"; }.movements-table td:nth-child(4)::before { content: "FIFO cost"; }
  .order-items-table td:nth-child(1)::before { content: "Recipe"; }.order-items-table td:nth-child(2)::before { content: "Start by"; }.order-items-table td:nth-child(3)::before { content: "Quantity"; }.order-items-table td:nth-child(4)::before { content: "Ingredient cost"; }
}

@media (display-mode: standalone) and (max-width: 991.98px) {
  .app-navbar { padding-top: calc(.6rem + env(safe-area-inset-top)); }
}