/* Additions to styles.css (which is the legacy tool's stylesheet, unchanged). */
.fontbtn .sample{height:26px;overflow:hidden;}
.fontbtn .sample svg{display:block;height:22px;width:auto;max-width:100%;margin-top:2px;fill:currentColor;}
.sym svg{display:block;width:100%;height:44px;margin-bottom:4px;fill:var(--sem-red);}
.sym .badge{display:inline-block;margin-top:3px;font-size:11px;padding:0 6px;border-radius:9px;background:var(--chip);color:var(--ink);}
.legend i.blue{border-top:2px solid #2f6fe0;}
.export{margin-top:16px;border:1px solid var(--line);border-radius:6px;padding:10px 12px;}
.export h2{font-size:16px;font-weight:600;margin:0 0 8px;}
.exportrow{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:8px;}
.act{font:inherit;font-size:13.5px;padding:8px 14px;min-height:40px;border:1px solid var(--line);border-radius:6px;background:var(--bg);color:var(--ink);cursor:pointer;}
.act.primary{background:var(--sem-red);border-color:var(--sem-red);color:#1F272D;font-weight:600;}
.act:disabled{opacity:.55;cursor:progress;}
.chk{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;}
.chk input{width:18px;height:18px;accent-color:var(--sem-red);}
.status .ref{float:right;font-size:12.5px;color:var(--muted);font-variant-numeric:tabular-nums;}
.stage.busy canvas{opacity:.85;transition:opacity .15s;}
input.code{width:12em;font-size:14px;padding:8px 10px;min-height:40px;}
/* Hide production-only parts until the catalog says which mode this is, so customers never see them flash. */
body:not(.ready) [data-internal],body:not(.ready) .top h1,body:not(.ready) .top p{visibility:hidden;}
.customer [data-internal]{display:none !important;}
/* Customer designer: "Use this design" stays in reach at the bottom of the options while scrolling. */
.usebar{position:sticky;bottom:0;z-index:2;display:flex;flex-wrap:wrap;gap:8px;align-items:center;background:var(--bg);border-top:1px solid var(--line);padding:12px 0 calc(12px + env(safe-area-inset-bottom,0px));}
.usebar .act.primary{flex:1 1 12em;min-height:48px;font-size:15px;}
.usebar .act{min-height:48px;}
.usebar .hint{flex-basis:100%;margin:0;}
/* In a frame on the Odoo page, the page's own close button sits over the top-right corner. */
.embedded .top{padding-right:64px;}
.embedded .brandbar{display:none;}