/* WolfPaw Antifraud for Miva — User Guide print styles (Magento-guide look) */
:root{
  --navy:#1f3b63;
  --ink:#333;
  --muted:#6b7280;
  --rule:#d4d9e0;
  --th:#e9eef6;
  --info-bar:#2f5aa8; --info-bg:#eef3fb;
  --warn-bar:#e0a030; --warn-bg:#fdf6e9;
  --code-bg:#f4f5f7;
}
*{box-sizing:border-box;}
html{font-size:10.5pt;}
body{
  font-family:Helvetica,Arial,sans-serif;
  color:var(--ink);
  line-height:1.5;
  margin:0;
  padding:0 0.9in;              /* left/right page gutter */
}
p{margin:0 0 10px;}
a{color:var(--info-bar); text-decoration:none;}

h1.section{
  color:var(--navy); font-size:21pt; font-weight:700;
  margin:0 0 14px; padding-top:6px;
  break-before:page;            /* each numbered section starts a page */
}
h1.section.first{break-before:auto;}
h2.card{color:var(--navy); font-size:13pt; font-weight:700; margin:20px 0 8px;}
h3.sub{color:var(--navy); font-size:11pt; font-weight:700; margin:16px 0 6px;}
h3.sub.i{font-style:italic;}

ul,ol{margin:0 0 10px; padding-left:22px;}
li{margin:0 0 6px;}
ul.tight li, ol.tight li{margin:0 0 3px;}

strong{color:#222;}
code,.mono{font-family:"DejaVu Sans Mono",Consolas,Menlo,monospace; font-size:9pt;}
pre{
  background:var(--code-bg); border:0.5px solid var(--rule); border-radius:3px;
  padding:9px 12px; margin:0 0 12px; font-size:9pt; line-height:1.45;
  white-space:pre-wrap; overflow-wrap:anywhere;
}
pre code{font-size:9pt;}

/* Tables */
table{width:100%; border-collapse:collapse; margin:4px 0 14px; font-size:9.5pt;}
th,td{border:0.5px solid var(--rule); padding:6px 9px; text-align:left; vertical-align:top;}
thead th{background:var(--th); color:#2b3850; font-weight:700;}
table.narrow td:first-child, table.narrow th:first-child{white-space:nowrap;}

/* Callouts */
.note,.warn{
  margin:10px 0 14px; padding:10px 14px; border-left:4px solid var(--info-bar);
  background:var(--info-bg); font-size:9.8pt;
  break-inside:avoid;
}
.warn{border-left-color:var(--warn-bar); background:var(--warn-bg);}
.note p:last-child,.warn p:last-child{margin-bottom:0;}

/* Title page */
.title-page{height:9.2in; break-after:page; padding-top:1.1in;}
.title-page .product{color:var(--navy); font-size:30pt; font-weight:700; line-height:1.1; margin:0;}
.title-page .by{color:var(--muted); font-size:14pt; margin:2px 0 18px;}
.title-page .platform{color:var(--navy); font-size:18pt; font-weight:700; margin:0 0 20px;}
.title-page .ug{color:var(--navy); font-size:13pt; font-weight:700; margin:0 0 6px;}
.title-page .ver{color:var(--muted); font-size:12pt; margin:0 0 22px;}
.title-page .lede{max-width:5.6in; margin:0 0 30px;}
.title-page .contact{color:var(--muted); font-size:9.5pt; line-height:1.5;}

/* TOC */
.toc h1{color:var(--navy); font-size:21pt; font-weight:700; margin:0 0 14px;}
.toc ol{list-style:none; padding-left:0; margin:0;}
.toc > ol > li{margin:0 0 5px; font-weight:600;}
.toc ol ol{padding-left:20px; margin:4px 0 8px; font-weight:400;}
.toc ol ol li{color:var(--muted); margin:0 0 2px; font-weight:400;}

/* Screenshot figure — swappable linked image with graceful placeholder */
figure.shot{
  margin:12px 0 16px; break-inside:avoid; text-align:center;
}
figure.shot .frame{
  border:0.5px solid var(--rule); border-radius:4px; padding:6px; background:#fff; display:inline-block; max-width:100%;
}
figure.shot img{max-width:100%; height:auto; display:block;}
/* placeholder shows only when the <img> fails to load (onerror swaps classes) */
figure.shot .ph{
  display:none; min-height:1.3in; width:6.2in; max-width:100%;
  border:1.5px dashed #b9c0cc; border-radius:4px; background:#fafbfc;
  color:#8a93a3; align-items:center; justify-content:center; flex-direction:column;
  padding:18px; text-align:center;
}
figure.shot.missing .frame{display:none;}
figure.shot.missing .ph{display:flex;}
figure.shot .ph .lbl{font-weight:700; color:#6b7585; font-size:10pt; margin-bottom:4px;}
figure.shot .ph .fn{font-family:"DejaVu Sans Mono",monospace; font-size:8.5pt; color:#9aa2b1;}
figcaption{color:var(--muted); font-size:8.8pt; font-style:italic; margin-top:5px;}

.break-avoid{break-inside:avoid;}