/* «Контент каталога» (content.js). Uses the shared Journey tokens only. */
#content .panel { margin-bottom:22px; }
#content .panel-head { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:8px 16px; }
#content td small { display:block; margin-top:3px; font-size:var(--journey-type-caption-size); color:var(--journey-color-text-secondary); }
#content .content-stats { grid-template-columns:repeat(4,minmax(0,1fr)); }
.content-tabs { margin:-14px 0 22px; }
.content-tabs a { padding:8px 12px; border-radius:6px; color:var(--journey-color-text-secondary); font-size:var(--journey-type-caption-size); text-decoration:none; }
.content-tabs a:hover { color:var(--journey-color-text-primary); }
.content-tabs a.active { background:var(--journey-color-bg-subtle); color:var(--journey-color-text-primary); font-weight:550; }
.content-needs { display:flex; flex-wrap:wrap; gap:4px; margin-top:6px; }
.content-form label { display:grid; gap:7px; font-size:var(--journey-type-caption-size); color:var(--journey-color-text-secondary); margin:0 0 16px; min-width:0; }
.content-form label small { font-size:var(--journey-type-caption-size); }
.content-form input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),.content-form select,.content-form textarea,
#content .content-grid input,.content-inline-form input,.content-upload select,#content td input,#content td select {
  padding:9px 10px; min-height:40px; width:100%; border:1px solid var(--journey-color-border-subtle); border-radius:6px;
  background:var(--journey-color-bg-surface); color:var(--journey-color-text-primary); font:inherit; font-size:var(--journey-type-footnote-size); }
.content-form textarea { resize:vertical; line-height:1.5; }
.content-form input::placeholder,.content-form textarea::placeholder { color:var(--journey-color-disabled-text); }
.content-checks { border:0; padding:0; margin:0 0 16px; }
.content-checks legend { font-size:var(--journey-type-caption-size); color:var(--journey-color-text-secondary); margin-bottom:6px; }
.content-checks label.check { display:flex; align-items:center; gap:10px; font-size:var(--journey-type-footnote-size); color:var(--journey-color-text-primary); min-height:32px; margin:0; }
.content-checks label.check input { width:18px; height:18px; accent-color:var(--journey-color-action-primary); }
#content .content-grid th,#content .content-grid td { padding:8px 6px; }
#content .content-grid input { min-width:72px; }
#content .content-grid td:first-child input { min-width:180px; }
.content-row-actions { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-top:14px; }
.content-photos { list-style:none; margin:14px 0; padding:0; display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:14px; }
.content-photo { display:grid; gap:8px; align-content:start; }
/* «Основное фото» of a colour (2026-11-12): the RadioTile of style.css around the PhotoTile, one group per colour. */
.content-photo label.radio-tile { margin:0; }
.content-photo select { padding:6px 8px; min-height:34px; width:100%; border:1px solid var(--journey-color-border-subtle); border-radius:6px; background:var(--journey-color-bg-surface); font:inherit; font-size:var(--journey-type-caption-size); }
.content-photo small { font-size:var(--journey-type-caption-size); color:var(--journey-color-text-secondary); }
.content-photo-actions { display:flex; gap:10px; align-items:center; }
.content-photos.source img { opacity:.85; }
.content-photo-state { min-width:0; overflow-wrap:anywhere; display:grid; gap:6px; align-content:center; justify-items:start; aspect-ratio:2/3; padding:12px; border:1px dashed var(--journey-color-border-control); border-radius:8px; background:var(--journey-color-bg-subtle); font-size:var(--journey-type-caption-size); }
.content-photo-state.failed { border-color:var(--journey-color-status-error-fg); }
.content-upload { display:flex; flex-wrap:wrap; gap:12px; align-items:end; margin-top:10px; }
.content-upload label { display:grid; gap:7px; font-size:var(--journey-type-caption-size); color:var(--journey-color-text-secondary); }
.file-button { display:inline-flex; align-items:center; cursor:pointer; color:var(--journey-color-text-primary); }
.file-button:focus-within { outline:2px solid var(--journey-color-focus-ring); outline-offset:2px; }
.text-button.danger { color:var(--journey-color-status-error-fg); }
.content-save .panel-body { display:grid; gap:10px; }
.content-save .primary { justify-content:center; }
.content-history li small { display:block; }
/* «Сочетается с»: the chosen products in order, the picker results and the «в обе стороны» box. */
.content-pairings,.content-pairing-results { list-style:none; margin:0 0 14px; padding:0; display:grid; gap:6px; }
.content-pairings li { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:6px 12px; padding:8px 10px; border:1px solid var(--journey-color-border-subtle); border-radius:6px; background:var(--journey-color-bg-surface); font-size:var(--journey-type-footnote-size); }
.content-pairing-title { min-width:0; overflow-wrap:anywhere; }
.content-pairing-results { margin-top:-8px; }
.content-pairing-results li { font-size:var(--journey-type-footnote-size); }
.content-form label.content-pairing-both { display:flex; align-items:center; gap:10px; font-size:var(--journey-type-footnote-size); color:var(--journey-color-text-primary); min-height:32px; margin:0 0 4px; }
.content-pairing-both input { width:18px; height:18px; accent-color:var(--journey-color-action-primary); }
.content-inline-form { display:flex; flex-wrap:wrap; gap:12px; align-items:end; }
.content-inline-form label { display:grid; gap:7px; font-size:var(--journey-type-caption-size); color:var(--journey-color-text-secondary); flex:1 1 160px; }
.content-inline-form .primary { flex:0 0 auto; }
.content-hex { font-variant-numeric:tabular-nums; max-width:110px; }
/* «Цвета» / «Материалы»: palette picker next to the HEX field, the code hint and a refusal next to the new-entry fields. */
.content-color-field { display:grid; gap:7px; font-size:var(--journey-type-caption-size); color:var(--journey-color-text-secondary); flex:0 1 170px; }
.content-color-pair { display:flex; gap:8px; align-items:center; }
#content .content-color-pair input[type="color"] { flex:0 0 40px; width:40px; min-height:40px; padding:3px; cursor:pointer;
  border:1px solid var(--journey-color-border-subtle); border-radius:6px; background:var(--journey-color-bg-surface); }
.content-field-error { flex:1 0 100%; margin:0; font-size:var(--journey-type-caption-size); color:var(--journey-color-status-error-fg); }
.content-field-error:empty { display:none; }
.content-columns { border:0; padding:0; margin:0 0 16px; }
.content-columns legend { font-size:var(--journey-type-caption-size); color:var(--journey-color-text-secondary); margin-bottom:6px; }
.content-column { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,2fr) auto; gap:8px; margin-bottom:8px; }
.content-column input { padding:9px 10px; min-height:40px; width:100%; border:1px solid var(--journey-color-border-subtle); border-radius:6px; background:var(--journey-color-bg-surface); font:inherit; font-size:var(--journey-type-footnote-size); }
.swatch { display:inline-block; width:14px; height:14px; border-radius:var(--journey-radius-full); border:1px solid var(--journey-color-border-control); vertical-align:-2px; }
.swatch.swatch-missing { background:repeating-linear-gradient(45deg,var(--journey-color-bg-subtle) 0 3px,var(--journey-color-bg-surface) 3px 6px); }
#content code { font-size:var(--journey-type-caption-size); }
.sync-content-card { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:10px 18px; padding:16px 20px; border:1px solid var(--journey-color-border-subtle); border-radius:10px; background:var(--journey-color-bg-surface); margin-bottom:22px; font-size:var(--journey-type-footnote-size); }
.sync-content-card strong { font-variant-numeric:tabular-nums; }
.sync-content-card a { font-weight:550; }
/* Catalog alert (alerts.js): products on the storefront without photo or description. Orders, sync and content pages. */
.catalog-alert { display:flex; gap:14px; align-items:flex-start; padding:16px 20px; margin:0 0 22px; border-radius:10px; border:1px solid var(--journey-color-border-subtle); border-left:3px solid var(--journey-color-status-warning-fg); background:var(--journey-color-status-warning-bg); color:var(--journey-color-text-primary); font-size:var(--journey-type-footnote-size); line-height:1.5; }
.catalog-alert p { margin:4px 0 0; color:var(--journey-color-text-secondary); }
.catalog-alert strong { color:var(--journey-color-status-warning-fg); }
.catalog-alert-mark { flex:0 0 auto; display:inline-grid; place-items:center; width:24px; height:24px; border-radius:var(--journey-radius-full); background:var(--journey-color-status-warning-fg); color:var(--journey-color-bg-surface); font-weight:700; font-size:var(--journey-type-footnote-size); }
.catalog-alert-links a { font-weight:550; color:var(--journey-color-text-primary); }
.nav-count.nav-alert { background:var(--journey-color-status-warning-bg); color:var(--journey-color-status-warning-fg); font-weight:650; font-variant-numeric:tabular-nums; }
.content-missing { color:var(--journey-color-status-warning-fg); font-size:var(--journey-type-caption-size); }
.content-missing-note { margin:0 0 16px; padding:10px 12px; border-radius:8px; background:var(--journey-color-status-warning-bg); color:var(--journey-color-status-warning-fg); font-size:var(--journey-type-caption-size); }
.content-photo-placeholder { display:flex; gap:14px; align-items:center; margin:14px 0; padding:16px; border:1px dashed var(--journey-color-border-control); border-radius:10px; background:var(--journey-color-bg-subtle); font-size:var(--journey-type-caption-size); color:var(--journey-color-text-secondary); }
.content-photo-placeholder span { flex:0 0 auto; display:grid; place-items:center; width:72px; aspect-ratio:2/3; border-radius:8px; background:var(--journey-color-bg-surface); border:1px solid var(--journey-color-border-subtle); font-size:var(--journey-type-title-2-size); color:var(--journey-color-icon-secondary); }
.content-photo-placeholder p { margin:0; }
/* «Сайт (Битрикс)» (bitrix.js). */
#content .stat strong.bitrix-mode { font-size:var(--journey-type-body-size); letter-spacing:0; margin:16px 0 14px; }
.bitrix-actions { display:flex; flex-wrap:wrap; gap:10px 14px; align-items:center; margin:0 0 22px; }
.bitrix-actions .primary:disabled { cursor:not-allowed; }
.bitrix-report { list-style:none; margin:0; padding:0; display:grid; gap:14px; }
.bitrix-report > li { padding:12px 14px; border-radius:8px; background:var(--journey-color-bg-subtle); font-size:var(--journey-type-footnote-size); }
.bitrix-report-head { display:flex; flex-wrap:wrap; gap:10px; align-items:center; justify-content:space-between; margin-bottom:8px; }
#content table.bitrix-changes th,#content table.bitrix-changes td { padding:6px 8px; font-size:var(--journey-type-caption-size); vertical-align:top; overflow-wrap:anywhere; }
@media(max-width:900px){ #content .content-stats { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:600px){ #content .page-heading { flex-direction:column; align-items:flex-start; } .content-photos { grid-template-columns:repeat(2,minmax(0,1fr)); } }
/* Preview updates keep the surrounding photo controls and editor focus in place. */
[data-photo-preview] { display:contents; }
[data-photo-queue] { overflow-wrap:anywhere; }

.content-photo-retry { display:grid; gap:var(--journey-spacing-8); min-width:0; }
.content-photo-state .tool-button, .content-photo-retry .tool-button { min-height:var(--journey-size-target-ios); max-width:100%; white-space:normal; overflow-wrap:anywhere; }

/* Shared photo-processing component: counts are copies, never an estimate of time. */
.photo-processing { display:grid; gap:var(--journey-spacing-8); min-width:0; width:100%; overflow-wrap:anywhere; font-size:var(--journey-type-caption-size); }
.photo-processing progress { display:block; width:100%; min-width:0; height:var(--journey-spacing-8); accent-color:var(--journey-color-text-primary); }
.photo-processing progress:indeterminate { animation:none; }
.photo-processing progress:indeterminate::-webkit-progress-value { animation:none; }
[data-photo-queue] { display:grid; gap:var(--journey-spacing-8); margin-block-end:var(--journey-spacing-8); }

/* Shared local photo intake: picker, file drop and thumbnail feedback use the same component. */
.photo-dropzone { border:1px dashed var(--journey-color-border-control); border-radius:var(--journey-radius-md); padding:var(--journey-spacing-12); }
.photo-dropzone.drag-active { border-color:var(--journey-color-text-primary); background:var(--journey-color-bg-subtle); }
.photo-drop-hint, .photo-intake-list { flex-basis:100%; }
.photo-intake-list { display:flex; flex-wrap:wrap; gap:var(--journey-spacing-12); margin:0; padding:0; list-style:none; }
.photo-intake-list > li { width:calc(var(--journey-size-control) * 3); min-width:0; max-width:100%; }
.photo-local-preview { position:relative; isolation:isolate; display:grid; align-items:end; width:100%; min-width:0; aspect-ratio:2/3; border-radius:var(--journey-radius-md); overflow:hidden; background:var(--journey-color-bg-subtle); }
.photo-local-preview > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-1; }
.photo-local-overlay { padding:var(--journey-spacing-8); background:var(--journey-color-bg-surface); color:var(--journey-color-text-primary); overflow-wrap:anywhere; }
.photo-local-overlay > [role="status"] { display:grid; gap:var(--journey-spacing-8); font-size:var(--journey-type-caption-size); }
.photo-local-overlay progress { width:100%; height:var(--journey-spacing-8); accent-color:var(--journey-color-text-primary); }
.content-photo-state:has(.photo-local-preview) { padding:0; display:block; }
.content-photo-state:has(.photo-local-preview) > small { display:none; }

.photo-intake-name { display:block; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.photo-local-overlay [role="status"] > span { min-height:calc(var(--journey-type-caption-line) * 2); line-height:var(--journey-type-caption-line); }

.photo-progress-count { display:inline-block; white-space:nowrap; }