/* BridalIQ POS help center. Colors come from the app's own variables in /app.css, so dark mode follows the device. */
body.help { font-size:16px; line-height:1.6; }
.hhead { display:flex; align-items:center; gap:12px; padding:12px 16px; background:var(--rail); color:var(--rail-fg); }
.hhead a { color:var(--rail-fg); text-decoration:none; }
.hbrand { font-weight:800; font-size:16px; letter-spacing:-.01em; }
.hbrand span { color:var(--rail-dim); font-weight:600; }
.hhead .grow { flex:1; }
.hback { font-size:13.5px; color:var(--rail-dim) !important; border:1px solid rgba(255,255,255,.18); border-radius:8px; padding:5px 10px; }
.hback:hover { color:var(--rail-fg) !important; }
.hmain { max-width:760px; margin:0 auto; padding:24px 16px 56px; }
.crumb { font-size:13.5px; color:var(--muted); margin-bottom:8px; }
.crumb a { color:var(--muted); }
.help h1 { font-size:28px; line-height:1.2; margin:0 0 8px; letter-spacing:-.015em; }
.help h2 { font-size:19px; margin:30px 0 8px; }
.help h3 { font-size:16px; margin:20px 0 6px; }
.lead { font-size:17px; color:var(--fg-2); margin:0 0 18px; }
.help p { margin:0 0 12px; }
.help ol, .help ul { margin:0 0 14px; padding-left:24px; }
.help li { margin:4px 0; }
.help ol > li::marker { font-weight:700; color:var(--accent); }
.help b, .help strong { font-weight:700; }
.help code, .help kbd { font-family:var(--font-num); font-size:.9em; background:var(--surface-2); padding:1px 5px; border-radius:5px; }
.help i.ui { font-style:normal; font-weight:700; }
.shot { margin:16px 0 20px; }
.shot img { display:block; max-width:100%; height:auto; border:1px solid var(--line); border-radius:10px; box-shadow:0 1px 3px rgba(0,0,0,.06); }
.shot figcaption { font-size:13px; color:var(--muted); margin-top:6px; }
.tip, .who { border-radius:10px; padding:12px 14px; margin:14px 0; font-size:15px; }
.tip { background:var(--accent-soft); color:var(--fg); }
.who { background:var(--surface-2); color:var(--fg); }
.tip b:first-child, .who b:first-child { display:block; margin-bottom:2px; }
.not { border-left:3px solid var(--warn); background:var(--warn-soft); border-radius:0 10px 10px 0; padding:10px 14px; margin:14px 0; font-size:15px; }
.hnext { display:flex; gap:12px; justify-content:space-between; margin-top:36px; border-top:1px solid var(--line); padding-top:16px; font-size:14.5px; }
.hnext a { text-decoration:none; max-width:48%; }
.hnext a span { display:block; font-size:12px; color:var(--muted); }
.hnext a.next { text-align:right; margin-left:auto; }
.hfoot { text-align:center; font-size:13px; color:var(--muted); padding:0 16px 32px; }
/* index */
.hsearch { width:100%; font-size:17px; padding:12px 14px; border-radius:10px; margin:6px 0 4px; }
.hcount { font-size:13px; color:var(--muted); min-height:20px; margin-bottom:8px; }
.hgroup h2 { font-size:13px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); margin:24px 0 8px; }
.hlist { list-style:none; padding:0 !important; margin:0; display:grid; gap:8px; }
.hlist li { margin:0; }
.hlist a { display:block; background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:12px 14px; text-decoration:none; color:var(--fg); }
.hlist a:hover { border-color:var(--accent); }
.hlist a b { display:block; color:var(--accent); font-size:16px; }
.hlist a span { display:block; font-size:14px; color:var(--fg-2); margin-top:2px; line-height:1.45; }
.hempty { color:var(--muted); padding:12px 0; }
@media (max-width:600px) { .help h1 { font-size:24px; } .hmain { padding-top:18px; } .hnext { flex-direction:column; } .hnext a { max-width:none; } .hnext a.next { text-align:left; margin-left:0; } }
@media print { .hhead, .hnext, .hfoot { display:none; } }

.defs{margin:0 0 16px}.defs dt{font-weight:700;margin-top:10px}.defs dd{margin:2px 0 0}