/* Отзывы */
.stars { color: var(--brand-accent); letter-spacing: 1px; white-space: nowrap; }
.stars .off { color: var(--grid); }
.review-text { max-width: 560px; white-space: pre-wrap; }
.review-text.empty-text { color: var(--text-muted); font-style: italic; }
.reply { display: grid; gap: 8px; margin-top: 8px; }
.reply textarea { font: inherit; color: var(--text-primary); background: var(--surface-1); border: 1px solid var(--border);
  border-radius: 8px; padding: 8px 12px; min-height: 72px; width: 100%; resize: vertical; }
.reply textarea:focus { outline: 2px solid var(--accent); outline-offset: -1px; }
.reply .actions { display: flex; gap: 8px; align-items: center; }
.comment { border-left: 3px solid var(--border); padding: 4px 12px; margin-top: 8px; font-size: 13px; }
.comment .who { color: var(--text-secondary); font-size: 12px; }
.reviews-toolbar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 12px; }
.products-toolbar { margin-top: 12px; }
.products-toolbar input.search { font: inherit; color: var(--text-primary); background: var(--surface-1); border: 1px solid var(--border);
  border-radius: 8px; padding: 8px 12px; height: 34px; width: min(320px, 100%); }
.products-toolbar input.search:focus { outline: 2px solid var(--accent); outline-offset: -1px; }
:root[data-theme="dark"] .products-toolbar input.search { background: rgb(255 255 255 / .07); border-color: rgb(255 255 255 / .16); box-shadow: inset 0 1px 0 rgb(255 255 255 / .14); }
:root[data-theme="light"] .products-toolbar input.search { background: rgb(255 255 255 / .7); border-color: rgb(15 23 42 / .14); box-shadow: inset 0 1px 0 rgb(255 255 255 / .9); }
.more { display: flex; justify-content: center; gap: 8px; margin-top: 12px; }
td .mark + .mark { margin-left: 4px; }

/* Отзывы по товарам */
tr.clickable { cursor: pointer; }
tr.clickable:hover td { background: var(--grid); }
tr.expanded td { background: var(--accent-soft); }
.sku-reviews { padding: 8px 0 4px; }
.sku-reviews .note { color: var(--text-secondary); font-size: 12px; margin-bottom: 8px; }

/* Фото и видео из отзывов */
.review-media { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.review-media img, .review-media .video { width: 72px; height: 72px; object-fit: cover; border-radius: 8px;
  border: 1px solid var(--border); background: var(--grid); cursor: zoom-in; display: block; }
.review-media .video { position: relative; }
.review-media .video::after { content: "▶"; position: absolute; inset: 0; display: grid; place-items: center;
  color: #fff; font-size: 22px; text-shadow: 0 0 6px rgb(0 0 0 / .8); }
.photo-dialog { padding: 0; width: auto; max-width: 92vw; max-height: 92vh; background: #000; border: 0; }
.photo-dialog img, .photo-dialog video { display: block; max-width: 92vw; max-height: 92vh; }
.photo-dialog .close { position: absolute; top: 8px; right: 8px; background: rgb(0 0 0 / .6); color: #fff; border: 0; }

/* Счётчик необработанных отзывов в меню */
.menu .badge { margin-left: auto; min-width: 22px; height: 20px; padding: 0 8px; border-radius: 10px;
  background: var(--accent); color: var(--accent-text); font: 600 12px/var(--lh-none) -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; display: inline-flex; align-items: center; justify-content: center;
  text-align: center; letter-spacing: 0; }
.menu .badge[hidden] { display: none; }

/* Сворачиваемые подробности в таблицах */
details.fold { margin-top: 8px; }
details.fold summary { cursor: pointer; color: var(--accent-text); font-size: 12px; font-weight: 600; list-style: none;
  display: inline-flex; align-items: center; gap: 8px; }
details.fold summary::-webkit-details-marker { display: none; }
details.fold summary::before { content: "▸"; font-size: 11px; transition: transform .15s; }
details.fold[open] summary::before { transform: rotate(90deg); }
:root[data-theme="dark"] details.fold summary { color: var(--text-primary); }

pre.raw { background: var(--grid); border-radius: 8px; padding: 12px 12px; font-size: 12px; overflow: auto; max-height: 360px; margin: 8px 0 0; }

/* Этапы изготовления HelloPrint */
.stages { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.stage { display: inline-flex; flex-direction: column; align-items: center; min-width: 74px; padding: 4px 8px;
  border: 1px solid var(--border); border-radius: 8px; font-size: 12px; color: var(--text-muted); background: var(--surface-1); line-height: var(--lh-tight); }
.stage small { font-size: 10px; color: var(--text-muted); }
.stage.done { background: var(--good-bg); border-color: var(--good-border); color: var(--text-primary); }
.stage.now { background: var(--accent-soft); border-color: var(--accent); color: var(--text-primary); font-weight: 600; }

/* Круг готовности заказа */
.ring { width: 60px; height: 60px; display: block; }
.ring .track { fill: none; stroke: var(--grid); stroke-width: 6; }
.ring .bar { fill: none; stroke: var(--accent); stroke-width: 6; stroke-linecap: round; transition: stroke-dasharray .4s; }
.ring .bar.full { stroke: var(--good-border); }
.ring.canceled .bar { stroke: var(--bad-border); }
.ring.canceled text { fill: var(--bad-border); }
.ring text { font-family: var(--font-display); font-size: 15px; font-weight: 700; fill: var(--text-primary); }
td:has(> .ring) { width: 1%; padding-right: 4px; }