.receipt-template-guidance { display:grid; gap:6px; padding:18px 20px; border:1px solid #ddd7c9; border-radius:12px; background:#fbf8ef; line-height:1.6; margin-bottom:20px; }
.receipt-template-guidance span { color:var(--muted,#737875); }
.receipt-template-layout { display:grid; grid-template-columns:minmax(340px,1fr) minmax(300px,390px); gap:22px; align-items:start; }
.receipt-template-editor { min-width:0; display:grid; gap:16px; }
.receipt-template-card { padding:22px; }
.receipt-template-card h3 { margin:0 0 18px; }
.receipt-template-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.receipt-template-fields label { display:grid; gap:7px; min-width:0; }
.receipt-template-fields label>span { font-weight:600; }
.receipt-template-fields input { width:100%; min-width:0; min-height:42px; padding:10px 12px; border:1px solid var(--line,#ddd7c9); border-radius:10px; background:#fcfaf8; color:var(--ink,#302e27); }
.receipt-template-fields input:focus { outline:2px solid #c78d5b; outline-offset:1px; }
.receipt-template-fields small { color:var(--muted,#737875); line-height:1.5; overflow-wrap:anywhere; }
.receipt-template-save-bar { position:sticky; bottom:16px; z-index:1; padding:18px; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:14px; border:1px solid #ddd; background:#fff; border-radius:12px; box-shadow:0 4px 20px #0000000d; }
.receipt-template-save-bar>div:first-child { display:grid; gap:5px; }
.receipt-template-save-bar>div:last-child { display:flex; gap:10px; flex-wrap:wrap; }
.receipt-template-save-bar small { color:var(--muted,#737875); }
#receiptTemplateValidation,.receipt-template-error { color:#a3302a; }
.receipt-template-error { padding:14px 18px; border:1px solid #edc4c0; border-radius:10px; background:#fff4f3; }
.receipt-template-preview { position:sticky; top:18px; padding:22px; min-width:0; }
.receipt-template-preview h3 { margin:0; }
.receipt-template-preview header p { color:var(--muted,#737875); font-size:13px; line-height:1.6; }
.receipt-template-preview-controls { display:flex; gap:12px; flex-wrap:wrap; margin:16px 0; }
.receipt-template-preview-controls label { display:grid; gap:6px; font-size:13px; flex:1; min-width:110px; }
.receipt-template-preview-controls select { min-height:38px; padding:7px 9px; border:1px solid var(--line,#ddd7c9); border-radius:8px; background:#fff; color:var(--ink,#302e27); }
#receiptTemplatePreview { padding:18px 8px; background:#eae8e3; border-radius:10px; overflow:auto; }
.receipt-sample-paper { margin:0 auto; padding:16px 12px 22px; background:#fff; color:#111; box-shadow:0 2px 8px #0000001a; font-family:'SimSun','Noto Serif CJK SC',serif; font-size:16px; line-height:1.5; }
.receipt-sample-paper.paper-58 { width:264px; }
.receipt-sample-paper.paper-80 { width:330px; }
.receipt-sample-title { display:block; font-size:18px; }
.receipt-sample-date { font-family:monospace; font-size:13px; }
.receipt-sample-paper hr { border:0; border-top:1px dashed #333; margin:11px 0; }
.receipt-sample-order { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:5px; }
.receipt-sample-order strong { background:#111; color:#fff; padding:0 5px; font-family:Arial,sans-serif; font-size:33px; line-height:1.25; }
.receipt-sample-order b { font-size:27px; overflow-wrap:anywhere; text-align:right; }
.receipt-sample-row { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.receipt-sample-row>span:first-child { overflow-wrap:anywhere; min-width:0; }
.receipt-sample-row>span:last-child { white-space:nowrap; font-family:Arial,sans-serif; text-align:right; }
.receipt-sample-order-no { font-size:11px; }
.receipt-sample-items { display:grid; grid-template-columns:30px minmax(0,1fr) 48px; gap:7px; font-size:15px; align-items:start; }
.receipt-sample-items>*:nth-child(3n) { text-align:right; font-family:Arial,sans-serif; }
.receipt-sample-items>*:nth-child(3n+2) { overflow-wrap:anywhere; }
.receipt-sample-due { font-size:30px; font-weight:bold; line-height:1.35; margin-top:4px; }
.receipt-template-preview-note { display:block; margin-top:16px; color:var(--muted,#737875); line-height:1.6; }
@media(max-width:1100px) { .receipt-template-layout { grid-template-columns:minmax(0,1fr); } .receipt-template-preview { position:static; } }
@media(max-width:600px) { .receipt-template-fields { grid-template-columns:minmax(0,1fr); } .receipt-template-card,.receipt-template-preview { padding:16px; } .receipt-template-save-bar { bottom:6px; } }
