/* Magento extensies: overview + documentation pages (generated by scripts/build-extension-pages.py) */
.xd{max-width:1180px;margin:0 auto;padding:0 1.5rem 2.5rem;}
.xd h2{font-size:1.45rem;font-weight:700;color:var(--text);margin:3.2rem 0 .5rem;letter-spacing:-.01em;scroll-margin-top:90px;}
.xd h3{font-size:1.08rem;font-weight:700;color:var(--text);margin:1.6rem 0 .5rem;}
.xd p,.xd li{font-size:.95rem;line-height:1.75;color:var(--text2);}
.xd p{margin:0 0 1rem;}
.xd ul,.xd ol{padding-left:1.4rem;margin:0 0 1rem;}
.xd ul{list-style:disc;}
.xd ol{list-style:decimal;}
.xd li{margin-bottom:.3rem;}
.xd a{color:var(--orange);font-weight:500;text-decoration:none;}
.xd a:hover{text-decoration:underline;}
.xd strong{color:var(--text);font-weight:600;}
.xd code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.85em;background:var(--bg2);border:1px solid var(--border);border-radius:5px;padding:.05em .35em;color:var(--text);word-break:break-word;}
.xd pre{background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:1rem 1.2rem;overflow-x:auto;margin:0 0 1.25rem;}
.xd pre code{background:none;border:0;padding:0;font-size:.84rem;line-height:1.65;word-break:normal;}
.xd-sub{font-size:1rem;color:var(--text2);margin:0 0 1.4rem;}

/* hero extras */
.xd-badges{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.2rem;}
.xd-badge{display:inline-flex;align-items:center;gap:.35rem;font-size:.74rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:.32rem .7rem;border-radius:999px;background:var(--badge-bg);border:1px solid var(--badge-border);color:var(--badge-text);}
.xd-badge.is-new{background:rgba(232,98,26,.1);border-color:rgba(232,98,26,.3);color:var(--orange);}
.xd-badge.is-soon{background:rgba(124,58,237,.1);border-color:rgba(124,58,237,.3);color:#7c3aed;}

/* table of contents */
.xd-toc{display:flex;flex-wrap:wrap;gap:.45rem;margin:2rem 0 0;padding:0 0 1.3rem;border-bottom:1px solid var(--border);}
.xd-toc a{font-size:.84rem;font-weight:600;padding:.35rem .8rem;border-radius:999px;border:1px solid var(--border2);color:var(--text2);}
.xd-toc a:hover{border-color:var(--orange);color:var(--orange);text-decoration:none;}

/* lead: text + visual */
.xd-lead{display:grid;grid-template-columns:1fr;gap:2.2rem;align-items:center;margin:2.6rem 0 1rem;}
@media(min-width:900px){.xd-lead{grid-template-columns:1fr 1.05fr;}}
.xd-lead h2{margin-top:0;}
.xd-lead p{font-size:1rem;line-height:1.8;}
.xd-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;margin-top:1.4rem;}
.xd-kpi{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:.85rem .9rem;}
.xd-kpi b{display:block;font-size:1.35rem;font-weight:800;color:var(--orange);letter-spacing:-.02em;line-height:1.1;}
.xd-kpi span{display:block;font-size:.76rem;line-height:1.4;color:var(--text2);margin-top:.25rem;}

/* mock app window (always light, like a screenshot) */
.xd-win{background:#fff;border:1px solid rgba(15,22,35,.1);border-radius:14px;box-shadow:0 18px 50px rgba(15,22,35,.16);overflow:hidden;color:#1d2733;font-size:13px;line-height:1.45;}
.xd-win-bar{display:flex;align-items:center;gap:6px;padding:9px 12px;background:#f1f3f7;border-bottom:1px solid #e3e7ee;}
.xd-win-bar i{width:10px;height:10px;border-radius:50%;background:#ff5f57;display:block;}
.xd-win-bar i:nth-child(2){background:#febc2e;}
.xd-win-bar i:nth-child(3){background:#28c840;}
.xd-win-url{flex:1;margin-left:8px;background:#fff;border-radius:6px;padding:3px 10px;font-size:11.5px;color:#5d6b7a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.xd-win-body{padding:18px;}
.xd-win.is-admin .xd-win-body{display:grid;grid-template-columns:44px 1fr;padding:0;}
.xd-win-side{background:#373330;display:flex;flex-direction:column;align-items:center;gap:14px;padding:16px 0;}
.xd-win-side span{width:18px;height:18px;border-radius:5px;background:rgba(255,255,255,.22);}
.xd-win-side span.on{background:#e8621a;}
.xd-win-main{padding:16px 18px;min-width:0;}
.m-title{font-size:17px;font-weight:700;color:#1d2733;margin:0 0 4px;}
.m-muted{color:#6b7787;font-size:12px;}
.m-label{font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#6b7787;margin:12px 0 6px;}
.m-field{border:1px solid #cfd6df;border-radius:7px;padding:7px 10px;background:#fff;color:#1d2733;margin-bottom:8px;display:flex;justify-content:space-between;gap:8px;}
.m-field.ok{border-color:#2f9e5b;background:#f2fbf5;}
.m-field em{font-style:normal;color:#9aa5b1;}
.m-grid2{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.m-btn{display:inline-block;background:#e8621a;color:#fff;font-weight:700;border-radius:7px;padding:7px 13px;font-size:12px;}
.m-btn.dark{background:#1d2733;}
.m-btn.ghost{background:#fff;color:#1d2733;border:1px solid #cfd6df;}
.m-btn.green{background:#2f9e5b;}
.m-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid #edf0f4;}
.m-row:last-child{border-bottom:0;}
.m-row b{color:#1d2733;}
.m-pill{display:inline-block;font-size:10.5px;font-weight:700;border-radius:999px;padding:2px 8px;background:#eef1f5;color:#4a5665;white-space:nowrap;}
.m-pill.g{background:#e3f6ea;color:#1f7a45;}
.m-pill.o{background:#fff1e3;color:#b4550c;}
.m-pill.r{background:#fde8e8;color:#b42318;}
.m-pill.b{background:#e6effc;color:#2d5fa6;}
.m-pill.p{background:#f1eafe;color:#6d28d9;}
.m-card{border:1px solid #e3e7ee;border-radius:10px;padding:10px 12px;background:#fff;}
.m-card.sel{border-color:#e8621a;background:#fff8f2;}
.m-radio{display:inline-block;width:13px;height:13px;border-radius:50%;border:2px solid #b6bfca;vertical-align:-2px;margin-right:6px;}
.m-radio.on{border-color:#e8621a;box-shadow:inset 0 0 0 3px #fff;background:#e8621a;}
.m-check{display:inline-block;width:14px;height:14px;border-radius:4px;border:2px solid #b6bfca;vertical-align:-2px;}
.m-check.on{background:#2f9e5b;border-color:#2f9e5b;position:relative;}
.m-check.on:after{content:"";position:absolute;left:3px;top:0;width:4px;height:8px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg);}
.m-table{width:100%;border-collapse:collapse;font-size:12px;}
.m-table th{text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:#6b7787;font-weight:700;padding:6px 6px;border-bottom:2px solid #e3e7ee;}
.m-table td{padding:7px 6px;border-bottom:1px solid #edf0f4;vertical-align:middle;color:#1d2733;}
.m-table tr.g td:first-child{box-shadow:inset 3px 0 0 #2f9e5b;}
.m-table tr.o td:first-child{box-shadow:inset 3px 0 0 #e8862a;}
.m-table tr.r td:first-child{box-shadow:inset 3px 0 0 #d64545;}
.m-bar{height:6px;border-radius:3px;background:#edf0f4;overflow:hidden;margin:4px 0 8px;}
.m-bar i{display:block;height:100%;background:#2f9e5b;border-radius:3px;}
.m-thumb{width:40px;height:40px;border-radius:8px;flex:0 0 40px;background:linear-gradient(135deg,#ffd9bf,#e8621a);}
.m-thumb.b{background:linear-gradient(135deg,#cfe0fb,#2d5fa6);}
.m-thumb.g{background:linear-gradient(135deg,#d3f2de,#2f9e5b);}
.m-flex{display:flex;align-items:center;gap:10px;}
.m-stack>*+*{margin-top:8px;}
.m-toast{position:absolute;right:14px;bottom:14px;background:#1d2733;color:#fff;border-radius:10px;padding:9px 12px;font-size:12px;box-shadow:0 10px 30px rgba(0,0,0,.25);max-width:230px;}
.m-rel{position:relative;}
.m-spark{display:flex;align-items:flex-end;gap:4px;height:70px;margin:8px 0 4px;}
.m-spark i{flex:1;background:#cfe0fb;border-radius:3px 3px 0 0;}
.m-spark i.hi{background:#2d5fa6;}
.m-ring{width:86px;height:86px;border-radius:50%;background:conic-gradient(#2f9e5b 0 86%,#edf0f4 86% 100%);display:grid;place-items:center;flex:0 0 86px;}
.m-ring span{width:66px;height:66px;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:22px;font-weight:800;color:#1f7a45;}
.m-serp{border:1px solid #e3e7ee;border-radius:10px;padding:10px 12px;}
.m-serp .u{font-size:11px;color:#3c6e3c;}
.m-serp .t{font-size:15px;color:#1a0dab;margin:2px 0;}
.m-stars{color:#f5a623;letter-spacing:1px;}
.m-chat{background:#f4f6fa;border-radius:12px;padding:10px 12px;}
.m-chat.me{background:#fff3ea;border:1px solid #ffd8bd;}
.m-code{font-family:ui-monospace,Menlo,monospace;font-size:11.5px;background:#0f1623;color:#cfe0fb;border-radius:9px;padding:10px 12px;line-height:1.6;white-space:pre;overflow:hidden;}
.m-code .ok{color:#7ee2a8;}
.m-code .no{color:#ff9b9b;}
.m-doc{background:#fff;border-radius:6px;box-shadow:0 6px 20px rgba(15,22,35,.15);padding:14px;font-size:10.5px;}
.m-lines i{display:block;height:6px;border-radius:3px;background:#e7ebf0;margin:5px 0;}
.xd-visual{position:relative;}
.xd-visual-cap{font-size:.78rem;color:var(--text3);margin-top:.7rem;text-align:center;}

/* flow / steps */
.xd-flow{display:grid;grid-template-columns:1fr;gap:1rem;margin:1.3rem 0 1.5rem;counter-reset:xs;}
@media(min-width:700px){.xd-flow{grid-template-columns:repeat(2,1fr);}}
@media(min-width:1000px){.xd-flow.n4{grid-template-columns:repeat(4,1fr);}.xd-flow.n3{grid-template-columns:repeat(3,1fr);}}
.xd-step{position:relative;background:var(--card);border:1px solid var(--border);border-radius:14px;padding:1.2rem 1.2rem 1.1rem;}
.xd-step-n{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--orange);color:#fff;font-weight:800;font-size:.9rem;margin-bottom:.7rem;}
.xd-step h3{margin:0 0 .3rem;font-size:1rem;}
.xd-step p{margin:0;font-size:.88rem;line-height:1.6;}
@media(min-width:1000px){.xd-flow.n4 .xd-step:not(:last-child):after,.xd-flow.n3 .xd-step:not(:last-child):after{content:"";position:absolute;right:-.85rem;top:2.1rem;width:.7rem;height:.7rem;border-top:2px solid var(--orange);border-right:2px solid var(--orange);transform:rotate(45deg);opacity:.6;}}

/* features */
.xd-feats{display:grid;grid-template-columns:1fr;gap:1rem;margin:1.3rem 0 1.5rem;}
@media(min-width:640px){.xd-feats{grid-template-columns:1fr 1fr;}}
@media(min-width:1000px){.xd-feats{grid-template-columns:repeat(3,1fr);}}
.xd-feat{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:1.25rem 1.3rem;}
.xd-feat h3{margin:.75rem 0 .35rem;font-size:1rem;}
.xd-feat p{margin:0;font-size:.89rem;line-height:1.65;}
.xd-ico{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:11px;background:rgba(232,98,26,.1);color:var(--orange);}
.xd-ico svg{width:22px;height:22px;}
.xd-ico.c-blue{background:rgba(45,95,166,.1);color:var(--blue-l);}
.xd-ico.c-green{background:rgba(47,158,91,.12);color:#2f9e5b;}
.xd-ico.c-purple{background:rgba(124,58,237,.1);color:#7c3aed;}
.xd-ico.c-teal{background:rgba(13,148,136,.11);color:#0d9488;}

/* screenshots */
.xd-shots{display:grid;grid-template-columns:1fr;gap:1.4rem;margin:1.3rem 0 1.5rem;}
@media(min-width:900px){.xd-shots.two{grid-template-columns:1fr 1fr;}}
.xd-shot{margin:0;}
.xd-shot a{display:block;border-radius:12px;overflow:hidden;border:1px solid var(--border2);box-shadow:var(--shadow);background:#fff;}
.xd-shot img{display:block;width:100%;height:auto;}
.xd-shot figcaption{font-size:.82rem;color:var(--text2);margin-top:.6rem;line-height:1.55;}
.xd-shot.narrow{max-width:420px;}

/* tables, callouts, specs */
.xd-table-wrap{overflow-x:auto;margin:0 0 1.5rem;border:1px solid var(--border);border-radius:12px;}
.xd-table{width:100%;border-collapse:collapse;font-size:.88rem;min-width:520px;}
.xd-table th,.xd-table td{text-align:left;vertical-align:top;padding:.7rem .95rem;border-bottom:1px solid var(--border);line-height:1.55;color:var(--text2);}
.xd-table th{background:var(--bg2);color:var(--text);font-weight:600;font-size:.82rem;}
.xd-table tr:last-child td{border-bottom:0;}
.xd-table td:first-child{color:var(--text);font-weight:600;}
.xd-callout{display:flex;gap:.9rem;background:var(--card);border:1px solid var(--border);border-left:3px solid var(--orange);border-radius:12px;padding:1rem 1.2rem;margin:0 0 1.5rem;}
.xd-callout p{margin:0;font-size:.92rem;}
.xd-callout.soon{border-left-color:#7c3aed;}
.xd-specs{display:grid;grid-template-columns:1fr;gap:0 2rem;margin:0 0 1rem;}
@media(min-width:640px){.xd-specs{grid-template-columns:1fr 1fr;}}
.xd-specs div{font-size:.92rem;line-height:1.6;color:var(--text2);padding:.6rem 0;border-bottom:1px solid var(--border);}
.xd-specs strong{display:inline-block;min-width:8.5rem;}

/* faq */
.xd-faq details{background:var(--card);border:1px solid var(--border);border-radius:12px;margin:0 0 .7rem;}
.xd-faq summary{cursor:pointer;list-style:none;padding:1rem 1.2rem;font-weight:600;color:var(--text);font-size:.97rem;display:flex;justify-content:space-between;gap:1rem;}
.xd-faq summary::-webkit-details-marker{display:none;}
.xd-faq summary:after{content:"+";color:var(--orange);font-weight:700;font-size:1.2rem;line-height:1;}
.xd-faq details[open] summary:after{content:"\2212";}
.xd-faq details p{padding:0 1.2rem 1rem;margin:0;}

/* related + pager */
.xd-related{display:grid;grid-template-columns:1fr;gap:1rem;margin:1.2rem 0 0;}
@media(min-width:700px){.xd-related{grid-template-columns:repeat(3,1fr);}}
.xd-pager{display:flex;justify-content:space-between;gap:1rem;margin-top:3rem;padding-top:1.4rem;border-top:1px solid var(--border);font-size:.9rem;flex-wrap:wrap;}
.xd-pager a{font-weight:600;}

/* overview */
.xo-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:.9rem;margin:2.4rem 0 0;}
@media(min-width:800px){.xo-stats{grid-template-columns:repeat(4,1fr);}}
.xo-stat{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:1.1rem 1.2rem;}
.xo-stat b{display:block;font-size:1.7rem;font-weight:800;color:var(--orange);letter-spacing:-.02em;line-height:1.1;}
.xo-stat span{font-size:.84rem;color:var(--text2);line-height:1.5;}
.xo-feature{display:grid;grid-template-columns:1fr;gap:1rem;margin:1.2rem 0 0;}
@media(min-width:900px){.xo-feature{grid-template-columns:repeat(3,1fr);}}
.xo-hl{display:flex;flex-direction:column;border-radius:16px;padding:1.4rem;border:1px solid var(--border);background:linear-gradient(160deg,rgba(232,98,26,.09),transparent 60%),var(--card);color:inherit;}
.xo-hl.soon{background:linear-gradient(160deg,rgba(124,58,237,.1),transparent 60%),var(--card);}
.xo-hl:hover{border-color:var(--orange);text-decoration:none!important;}
.xo-hl h3{margin:.8rem 0 .35rem;font-size:1.1rem;color:var(--text);}
.xo-hl p{margin:0 0 1rem;font-size:.9rem;line-height:1.65;color:var(--text2);flex:1;}
.xo-hl .go{font-weight:700;color:var(--orange);font-size:.88rem;}
.xo-grid{display:grid;grid-template-columns:1fr;gap:1rem;}
@media(min-width:640px){.xo-grid{grid-template-columns:1fr 1fr;}}
@media(min-width:1000px){.xo-grid{grid-template-columns:repeat(3,1fr);}}
.xo-card{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--border);border-radius:14px;padding:1.25rem 1.3rem;color:inherit;transition:border-color .15s,transform .15s;}
.xo-card:hover{border-color:var(--orange);transform:translateY(-2px);text-decoration:none!important;}
.xo-card-top{display:flex;align-items:center;justify-content:space-between;gap:.6rem;}
.xo-card h3{margin:.8rem 0 .35rem;font-size:1.02rem;color:var(--text);}
.xo-card p{margin:0 0 1rem;font-size:.88rem;line-height:1.62;color:var(--text2);flex:1;}
.xo-card .go{font-weight:700;color:var(--orange);font-size:.85rem;}
.xo-tag{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--text3);}
.xo-tag.is-new{color:var(--orange);}
.xo-tag.is-soon{color:#7c3aed;}
.xo-group-head{display:flex;align-items:center;gap:.8rem;margin:3.2rem 0 .3rem;scroll-margin-top:90px;}
.xo-group-head h2{margin:0;}
.xo-jump{display:flex;flex-wrap:wrap;gap:.45rem;margin:2rem 0 0;}
.xo-jump a{font-size:.84rem;font-weight:600;padding:.4rem .85rem;border-radius:999px;border:1px solid var(--border2);color:var(--text2);}
.xo-jump a:hover{border-color:var(--orange);color:var(--orange);text-decoration:none;}
.xo-usp{display:grid;grid-template-columns:1fr;gap:1rem;margin:3rem 0 0;}
@media(min-width:760px){.xo-usp{grid-template-columns:repeat(3,1fr);}}
.xo-usp>div{display:flex;gap:.9rem;align-items:flex-start;}
.xo-usp p{margin:.15rem 0 0;font-size:.9rem;line-height:1.65;}
.xo-usp strong{display:block;font-size:.98rem;}
@media(min-width:760px){.xd-shots.qr{grid-template-columns:minmax(0,2.2fr) minmax(0,1fr);align-items:start;}}
@media(max-width:560px){
.xd-win{font-size:12px;}
.xd-win.is-admin .xd-win-body{grid-template-columns:1fr;}
.xd-win-side{display:none;}
.xd-win-main,.xd-win-body{padding:12px;overflow-x:auto;}
.xd-win.is-admin .xd-win-body{padding:0;}
.m-table th,.m-table td{padding:6px 4px;}
.m-card{padding:8px 9px;min-width:0;}
.m-toast{position:static;margin-top:10px;max-width:none;}
.xd-kpis{grid-template-columns:1fr 1fr;}
}
@media(min-width:900px){.xd-shots.two .xd-shot.wide{grid-column:1/-1;}}