:root {
  color-scheme: light;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #17231d;
  background: #f4f6f4;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-text-size-adjust: 100%;
}
* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; }
a { color: #387451; }
.site-header {
  min-height: 58px;
  padding: 0 max(16px, calc((100% - 1080px) / 2));
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: clamp(6px, 2vw, 16px);
  color: #fff;
  background: #173c2b;
}
.brand { margin-inline-end: auto; color: inherit; text-decoration: none; font-size: 16px; font-weight: 800; letter-spacing: .055em; }
.menu { position: relative; }
.menu-trigger {
  width: 42px; height: 42px; display: grid; place-items: center; list-style: none;
  border-radius: 11px; cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.menu-trigger::-webkit-details-marker { display: none; }
.menu-trigger:hover, .menu[open] .menu-trigger { background: #ffffff1c; }
.menu-icon, .menu-icon::before, .menu-icon::after {
  width: 21px; height: 2px; border-radius: 2px; background: #fff; display: block; content: ""; position: relative;
}
.menu-icon::before { position: absolute; top: -6px; }
.menu-icon::after { position: absolute; top: 6px; }
.menu-panel {
  position: absolute; z-index: 20; top: calc(100% + 8px); right: 0;
  width: min(290px, calc(100vw - 24px)); padding: 7px;
  display: flex; flex-direction: column; gap: 2px;
  background: #fff; border: 1px solid #e5ebe7; border-radius: 14px;
  box-shadow: 0 14px 36px #12271c2b; max-height: min(78vh, 620px); overflow-y: auto;
}
.menu-panel a { min-height: 48px; padding: 13px 14px; display: flex; align-items: center; border-radius: 9px; color: #203b2d; text-decoration: none; font-size: 15px; font-weight: 600; }
.menu-panel a:hover, .menu-panel a:focus-visible { background: #edf4ef; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
main { max-width: 1080px; margin: 22px auto; padding: 0 18px; }
.search { display: flex; gap: 9px; margin: 0 0 25px; }
input, textarea, select { width: 100%; border: 1px solid #cbd5ce; border-radius: 9px; padding: 11px 12px; color: inherit; background: #fff; font: inherit; }
.search input { min-width: 0; min-height: 48px; flex: 1; font-size: 16px; }
button, .button { border: 0; border-radius: 9px; padding: 11px 15px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; color: #fff; background: #247447; font: inherit; font-weight: 700; text-decoration: none; cursor: pointer; -webkit-tap-highlight-color: transparent; }
button:active, .button:active { transform: translateY(1px); }
.search-button { min-width: 78px; min-height: 48px; }
.category-filter { display: flex; align-items: end; gap: 9px; margin: -9px 0 22px; padding: 12px; border: 1px solid #e5ebe7; border-radius: 13px; background: #fff; }
.category-filter label { min-width: 0; flex: 1; color: #607067; font-size: 12px; }
.category-filter select { display: block; min-height: 42px; margin-top: 4px; padding: 8px 10px; font-size: 14px; }
.category-filter select:disabled { color: #98a39d; background: #f1f3f1; }
.category-filter-button { min-height: 42px; padding: 9px 14px; white-space: nowrap; font-size: 14px; }
.clear-filter { align-self: center; white-space: nowrap; font-size: 13px; }
.category-accordion { margin: 14px 0; overflow: hidden; border: 1px solid #e5ebe7; border-radius: 15px; background: #fff; box-shadow: 0 2px 9px #173c2b0b; }
.category-accordion-title, .subcategory-accordion-title { display: flex; align-items: center; gap: 12px; cursor: pointer; list-style: none; }
.category-accordion-title::-webkit-details-marker, .subcategory-accordion-title::-webkit-details-marker { display: none; }
.category-accordion-title { min-height: 54px; padding: 12px 16px; color: #17231d; font-size: 18px; font-weight: 750; }
.category-accordion-title::after, .subcategory-accordion-title::after { content: "⌄"; color: #607067; font-size: 18px; transition: transform .15s ease; }
.category-accordion[open]>.category-accordion-title::after, .subcategory-accordion[open]>.subcategory-accordion-title::after { transform: rotate(180deg); }
.category-count { min-width: 24px; height: 24px; padding: 3px 7px; border-radius: 999px; color: #466253; background: #edf3ef; font-size: 12px; font-weight: 650; text-align: center; }
.category-accordion-title .category-count, .subcategory-accordion-title .category-count { margin-left: auto; }
.subcategory-accordion { margin: 0 12px 12px; border: 1px solid #e8ede9; border-radius: 12px; background: #f8faf8; }
.subcategory-accordion-title { min-height: 45px; padding: 10px 12px; color: #355944; font-size: 15px; font-weight: 700; }
.category-accordion>.cards, .subcategory-accordion>.cards { padding: 0 12px 12px; }
.category-accordion>.cards { padding-inline: 12px; }
.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 12px; }
.card { position: relative; min-width: 0; padding: 16px; border-radius: 16px; background: #fff; box-shadow: 0 2px 9px #173c2b0b; }
.product-card { min-height: 134px; display: grid; grid-template-columns: 1fr; grid-template-rows: 1fr auto; gap: 10px; }
.card-info { grid-column: 1; grid-row: 1; align-self: start; min-width: 0; padding: 2px 38px 0 0; }
.card-info strong { display: block; font-size: 17px; line-height: 1.3; overflow-wrap: anywhere; }
.card-info small { display: block; margin-top: 5px; color: #718078; font-size: 14px; }
.edit-icon { position: absolute; top: 10px; right: 10px; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; color: #557463; background: #f0f4f1; }
.edit-icon:hover, .edit-icon:focus-visible { color: #1b623b; background: #e4efe7; }
.edit-icon svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.card-print { min-width: 0; max-width: 100%; grid-column: 1; grid-row: 2; justify-self: end; width: auto; margin: 0; display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.print-controls { display: flex; align-items: end; justify-content: flex-end; gap: 9px; }
.copies-control { width: 70px; display: block; flex: none; text-align: center; }
.copies-caption { display: block; margin-bottom: 3px; color: #718078; font-size: 11px; }
.copies-select { width: 70px; height: 43px; padding: 5px 8px; border-radius: 10px; color: #205d39; background: #fff; font-size: 17px; font-weight: 700; text-align: center; cursor: pointer; }
.print { min-height: 43px; padding: 0 14px; white-space: nowrap; font-size: 14px; }
.manual-date { width: min(240px, 100%); color: #607067; font-size: 12px; }
.manual-date input { min-height: 40px; margin-top: 4px; padding: 8px; font-size: 13px; }
.empty-state { padding: 16px; color: #718078; }
.flash { margin-bottom: 14px; padding: 12px 14px; border-radius: 10px; background: #e4f4e9; }
.flash.error { background: #ffeded; }
.print:disabled { opacity: .65; cursor: wait; }
.toast { position: fixed; z-index: 40; left: 50%; bottom: calc(18px + env(safe-area-inset-bottom)); max-width: calc(100vw - 28px); padding: 12px 18px; border-radius: 999px; color: #fff; background: #173c2b; box-shadow: 0 8px 28px #12271c40; font-size: 14px; font-weight: 650; text-align: center; opacity: 0; transform: translate(-50%, 12px); pointer-events: none; transition: opacity .18s ease, transform .18s ease; }
.toast-visible { opacity: 1; transform: translate(-50%, 0); }
.toast-error { background: #9d302c; }
.delete-product-form { margin-top: 18px; }
.delete-button { min-height: 42px; color: #842c28; background: #f8e8e7; }
.delete-button:hover, .delete-button:focus-visible { background: #f1d6d4; }

/* Product editor */
h1 { margin: 0 0 18px; font-size: 24px; }
h2 { font-size: 17px; }
.editor { display: grid; grid-template-columns: minmax(320px, 1fr) minmax(280px, 1fr); gap: 26px; align-items: start; }
.settings { min-width: 0; overflow-wrap: anywhere; padding: 20px; border-radius: 14px; background: #fff; }
.settings h2 { margin: 22px 0 12px; }
.settings h2:first-child { margin-top: 0; }
.settings>label:not(.check):not([hidden]) { display: block; margin: 11px 0; }
.settings label { color: #42534a; font-size: 14px; }
.settings label input, .settings label textarea, .settings label select { display: block; margin-top: 5px; }
.check { display: flex; align-items: center; gap: 9px; margin: 11px 0; }
.check input { flex: none; width: 18px; height: 18px; margin: 0; accent-color: #247447; }
.prominent-check { padding: 12px; border-radius: 10px; color: #1d5637 !important; background: #edf5ef; line-height: 1.4; }
.hint { margin: 8px 0 18px; color: #718078; font-size: 13px; line-height: 1.5; }
.field-caption { display: block !important; margin: 3px 0 10px !important; color: #6d7b73 !important; font-size: 12px !important; }
.two, .three { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
textarea { min-height: 64px; resize: vertical; }
.actions { display: flex; gap: 10px; margin-top: 18px; }
button.quiet-action {
  background: transparent;
  color: #51635a;
  font-size: .875rem;
  font-weight: 500;
  text-decoration: underline;
}
button.quiet-action:hover { color: #8a342d; }
.secondary { color: #284536; background: #e6ece8; }
.preview-wrap { position: sticky; top: 18px; }
.preview-wrap h2 { margin-top: 0; }
.label-preview { width: min(100%, 420px); aspect-ratio: 58 / 40; padding: 6%; display: flex; flex-direction: column; justify-content: center; gap: 4px; overflow: hidden; border: 1px dashed #99a69e; border-radius: 4px; color: #24372d; background: #fff; font-size: 9px; line-height: 1.15; overflow-wrap: anywhere; }
.label-preview .pv-title { color: #173c2b; font-weight: 700; }
.label-preview [data-line=made], .label-preview [data-line=expires], .label-preview [data-line=storage] { color: #35463c; }
.label-preview [data-line=extra] { color: #247447; font-style: italic; }
.preview-wrap p { color: #66766c; font-size: 13px; }
.compact-settings { max-width: 680px; }
.developer-settings { max-width: 680px; margin-top: 18px; }
.developer-settings>summary { color: #284536; font-weight: 700; cursor: pointer; }
.developer-settings[open]>summary { margin-bottom: 16px; }
.developer-settings .optional { color: #718078; font-size: 12px; }
.developer-settings .test-print-form { margin-top: 18px; padding-top: 16px; border-top: 1px solid #e8ede9; }
.developer-settings .test-print-form .hint { margin-bottom: 0; }
.transfer-settings { margin-bottom: 18px; }
.transfer-settings>summary { color: #284536; font-weight: 700; cursor: pointer; }
.transfer-settings[open]>summary { margin-bottom: 16px; }
.transfer-settings .import-products-form { margin: 16px 0 10px; padding-top: 16px; border-top: 1px solid #e8ede9; }
.transfer-settings .import-products-form input[type=file] { display: block; margin: 6px 0 12px; padding: 9px; font-size: 14px; }

/* Print history */
.table-wrap { overflow: auto; border-radius: 12px; background: #fff; }
table { width: 100%; min-width: 640px; border-collapse: collapse; }
th, td { padding: 12px; border-bottom: 1px solid #e8ede9; text-align: left; }
th { background: #eaf0ec; }

@media (max-width: 700px) {
  .site-header { min-height: 54px; padding-inline: 14px; }
  .menu { z-index: 21; }
  .menu[open]::before { position: fixed; z-index: 19; inset: 54px 0 0; content: ""; background: #12271c66; pointer-events: none; }
  .menu[open] .menu-panel { position: fixed; z-index: 20; top: 54px; right: 0; bottom: 0; width: min(310px, 84vw); height: calc(100dvh - 54px); max-height: none; padding: 10px; border-radius: 17px 0 0 0; overflow-y: auto; animation: drawer-in .16s ease-out; }
  .menu-panel a { min-height: 52px; }
  .brand { font-size: 15px; }
  main { margin: 16px auto 24px; padding-inline: 14px; }
  .search { gap: 7px; margin-bottom: 19px; }
  .search input { min-height: 46px; padding-inline: 12px; }
  .search-button { min-width: 68px; min-height: 46px; padding-inline: 10px; }
  .category-filter { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: -7px 0 19px; padding: 10px; }
  .category-filter-button { grid-column: 1 / 2; }
  .clear-filter { grid-column: 2 / 3; justify-self: center; }
  .category-accordion { margin: 12px 0; border-radius: 14px; }
  .category-accordion-title { min-height: 50px; padding: 11px 13px; font-size: 17px; }
  .subcategory-accordion { margin: 0 9px 9px; }
  .cards { grid-template-columns: 1fr; gap: 10px; }
  .product-card { min-height: 126px; padding: 15px 14px 13px; border-radius: 15px; }
  .card-info strong { font-size: 17px; }
  .card-info small { font-size: 14px; }
  .edit-icon { top: 8px; right: 8px; width: 38px; height: 38px; }
  .print-controls { gap: 8px; }
  .copies-control, .copies-select { width: 68px; }
  .copies-select { height: 44px; font-size: 17px; }
  .print { min-height: 44px; padding-inline: 14px; font-size: 14px; }
  .editor { grid-template-columns: 1fr; gap: 18px; }
  .preview-wrap { position: static; grid-row: 1; }
  .preview-wrap h2 { margin: 0 0 10px; }
  .label-preview { width: min(100%, 430px); }
  .settings { padding: 16px; }
  h1 { font-size: 22px; }
}
@keyframes drawer-in { from { opacity: .7; transform: translateX(12px); } to { opacity: 1; transform: translateX(0); } }
@media (max-width: 380px) {
  .brand { font-size: 14px; }
  .product-card { min-height: 122px; }
  .category-filter { grid-template-columns: 1fr; }
  .category-filter-button, .clear-filter { grid-column: auto; }
  .copies-control, .copies-select { width: 62px; }
  .print { padding-inline: 10px; font-size: 13px; }
  .two { gap: 7px; }
  .three { grid-template-columns: 1fr; }
}

.catalog-actions, .printer-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.printer-settings, .category-settings { margin-bottom: 12px; }
.printer-settings h3 { margin-top: 0; }
.printer-settings img { display: block; max-width: 100%; height: auto; }
.category-settings > form + form { margin-top: 8px; }
.availability-table .branch-column { min-width: 7rem; text-align: center; overflow-wrap: anywhere; }
.availability-table .availability-section th { padding-block: 10px; }
.availability-table th[scope="row"] { text-align: left; min-width: 10rem; }
.availability-table th[scope="row"] small { display: block; margin-top: 3px; font-weight: 400; }
.availability-table td, .availability-table .action-column { text-align: center; }
.availability-table input[type="checkbox"] { width: 1.25rem; height: 1.25rem; accent-color: #247447; }

.category-settings label { display: block; margin-bottom: 12px; }

.session-page-size {
  display: flex;
  align-items: end;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 0 16px;
}
.session-page-size label { display: grid; gap: 6px; color: #42534a; font-size: .875rem; }
.session-page-size select, .session-page-size button { min-height: 44px; }
.session-page-size select { width: 10rem; }
.session-list { display: grid; gap: 12px; }
.session-card { border: 1px solid #e5ebe7; }
.session-times { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 8px; }
.session-card .hint { margin: 8px 0 12px; overflow-wrap: anywhere; }
.session-pages { margin-top: 16px; }

.branch-overview { display: grid; gap: 16px; }
.branch-overview h2 { margin: 0 0 14px; }
.branch-create { display: flex; flex-wrap: wrap; align-items: end; gap: 10px; }
.branch-create label { flex: 1 1 15rem; min-width: 0; }
.branch-create input, .branch-create button { min-height: 44px; }
.branch-list, .branch-jobs { display: grid; gap: 8px; list-style: none; margin: 0; padding: 0; }
.branch-list a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  border-radius: 9px;
  background: #edf3ef;
  font-weight: 650;
  text-decoration: none;
}
.branch-list a:hover, .branch-list a:focus-visible { background: #e1eee5; }
.branch-jobs li { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; padding: 12px 0; }
.branch-jobs li + li { border-top: 1px solid #e5ebe7; }
.branch-jobs small { flex-basis: 100%; color: #51635a; }
.job-status { padding: 4px 8px; border-radius: 8px; background: #edf3ef; color: #355944; font-size: .875rem; }

.branch-detail { width: min(100%, 680px); display: grid; gap: 16px; }
.branch-detail > h1 { margin: 0; }
.branch-detail-group { display: grid; gap: 12px; min-width: 0; }
.branch-detail-group > h2 { margin: 0; }
.branch-detail-group > .printer-settings { margin: 0; }
.branch-detail .settings select { min-height: 44px; }
.branch-menu-items { display: grid; gap: 8px; }
.branch-menu-items > p { margin: 0; }
.branch-menu-item {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 12px;
  padding: 10px 14px;
  border-radius: 9px;
  background: #fff;
  overflow-wrap: anywhere;
}

.printer-share { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.printer-share input { flex: 1 1 14rem; min-width: 0; }
.copy-printer-status:not(:empty) { flex-basis: 100%; color: #51635a; font-size: .875rem; }