/* Stand-alone Invoice & Receipt page: the few base styles the tool needs outside the main app. */
:root{
  --brand:#0F6E56;--brand-2:#0B5443;--brand-bg:#E1F5EE;--brand-line:#BDE6D6;--brand-ink:#0B5443;
  --panel-soft:#FAFCFB;--muted-soft:#8C9891;--shadow-md:0 4px 16px rgba(20,31,27,.05);
}
html[data-mode="dark"]{--brand:#34D399;--brand-2:#6EE7B7;--brand-bg:#12362B;--brand-line:#17483A;--brand-ink:#6EE7B7;}
main.page.tool-page{max-width:1180px;}
main.page.tool-page .lead{max-width:none;}
.tool-app{margin:6px 0 40px;min-height:70vh;}
.tool-prose{max-width:820px;}
.tool-noscript{padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--panel-soft);}

.status{font-size:13px;color:var(--muted);margin-top:14px;display:none;align-items:center;gap:7px;}
.status:not(:empty){display:flex;}
.status::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--muted-soft);flex-shrink:0;}
.status.loading{color:var(--ink);}
.status.success{color:var(--brand-ink);}
.status.success::before{background:var(--brand);}
.status.error{color:var(--warn);}
.status.error::before{background:var(--warn);}

.btn{
  position:relative;min-height:46px;padding:12px 18px;border-radius:12px;font:600 14px/1.2 inherit;white-space:nowrap;cursor:pointer;
  border:1px solid var(--line);background:var(--panel);color:var(--ink);display:flex;align-items:center;justify-content:center;gap:9px;
  transition:background-color .18s,border-color .18s,color .18s,box-shadow .18s,transform .12s;
}
.btn svg{width:18px;height:18px;flex-shrink:0;}
.btn:hover:not(:disabled){transform:translateY(-1px);}
.btn.primary{width:100%;margin-top:18px;color:#fff;background:var(--brand);border-color:var(--brand);box-shadow:0 6px 16px -6px var(--brand);}
html[data-mode="dark"] .btn.primary{color:#052E22;}
.btn.primary:hover:not(:disabled){background:var(--brand-2);}
.btn.primary:disabled{background:var(--brand-bg);border-color:var(--brand-line);color:var(--muted);cursor:not-allowed;box-shadow:none;}
.btn.secondary-block{width:auto;border-radius:99px;color:var(--brand-ink);border-color:var(--brand-line);}
.btn.secondary-block:hover:not(:disabled){background:var(--brand-bg);border-color:var(--brand);}
.btn:focus-visible{outline:2px solid var(--brand);outline-offset:2px;}
.tool-app .tw-actions .btn.primary{margin-top:0;}
/* Header and content use 80% of the screen width on wide screens */
main.page.tool-page{max-width:none;width:80%;}
@media (max-width:1100px){main.page.tool-page{width:100%;max-width:1180px;}}
/* Compact page heading */
main.page.tool-page{padding-top:24px;}
.tool-page .crumbs{margin-bottom:10px;}
.tool-page h1{font-size:clamp(22px,2.6vw,28px);margin:0 0 6px;}
.tool-page .lead{font-size:14px;line-height:1.5;margin:0 0 16px;}

.crop-nav-btn{width:34px;height:34px;border:1px solid var(--line);border-radius:9px;background:var(--panel);color:var(--ink);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:18px;transition:background-color .15s,border-color .15s;}
.crop-nav-btn:hover:not(:disabled){background:var(--brand-bg);border-color:var(--brand);color:var(--brand-ink);}
.crop-nav-btn:disabled{opacity:.4;cursor:not-allowed;}
/* Smaller download button */
.tool-app .tw-actions{justify-content:flex-start;}
.tool-app .tw-actions .btn.primary{width:auto;min-height:40px;padding:9px 22px;font-size:13.5px;border-radius:99px;box-shadow:0 4px 12px -5px var(--brand);}
.tool-app .tw-actions .btn.primary svg{width:16px;height:16px;}
@media (max-width:480px){.tool-app .tw-actions .btn.primary{width:100%;}}
