/* Customer photos (spectro-rth, inc/photos.php): the "Your photo" row, same family as the buy box's fit card. */
.ph { margin-top: 12px; }
.ph-row { position: relative; display: grid; grid-template-columns: 44px 1fr auto; gap: 12px; align-items: center; padding: 10px 14px 10px 10px; border: 1px dashed var(--sand-2, #E6DCCF); border-radius: var(--r, 6px); background: #fff; cursor: pointer; transition: border-color .2s; }
.ph-row:hover { border-color: var(--ink, #3A2E28); }
.ph-in { position: absolute; width: 1px; height: 1px; opacity: 0; }
.ph-row:has(.ph-in:focus-visible) { outline: 2px solid var(--accent, #8A6750); outline-offset: 2px; }
.ph-ic { display: grid; place-items: center; width: 44px; height: 44px; overflow: hidden; border-radius: 4px; background: var(--sand, #F0E9E0); }
.ph-ic svg { width: 22px; height: 22px; fill: none; stroke: var(--ink, #3A2E28); stroke-width: 1.5; }
.ph-ic img { width: 100%; height: 100%; object-fit: cover; }
.ph-tx { min-width: 0; }
.ph-tx b { display: block; font-size: 14.5px; color: var(--ink, #3A2E28); }
.ph-tx small { display: block; font-size: 13px; color: var(--body, #5C4F46); overflow-wrap: anywhere; }
.ph-row em { font-style: normal; font-weight: 600; font-size: 14px; color: var(--ink, #3A2E28); text-decoration: underline; text-underline-offset: 3px; }
.ph.ok .ph-row { border-style: solid; border-color: var(--line, #E5DACD); }
.ph.ok .ph-tx small::before { content: "✓ "; color: #3E7B4F; font-weight: 700; }
.ph.bad .ph-tx small { color: #A33A2A; }
.ph.busy .ph-row { cursor: progress; }
.ph-bar { position: absolute; left: 10px; right: 10px; bottom: 4px; height: 3px; border-radius: 2px; background: var(--sand, #F0E9E0); overflow: hidden; }
.ph-bar > i { display: block; height: 100%; width: 4%; background: var(--accent, #8A6750); transition: width .2s; }
.ph-bar[hidden] { display: none; }

/* After the order: thank-you page, My account, /upload-photo/ */
.ph-order { margin: 0 0 32px; padding: 20px; border-radius: 10px; background: var(--sand, #F0E9E0); }
.ph-order h2 { margin: 0 0 6px; font: 400 24px/1.2 var(--serif, serif); color: var(--ink, #3A2E28); }
.ph-order > p { margin: 0 0 6px; color: var(--body, #5C4F46); }
.ph-page { max-width: 640px; padding-top: 40px; padding-bottom: 80px; }
.ph-page .kicker { margin-bottom: 12px; }