/* Logo slot on the document (shared). Empty state is an upload glyph in a dashed box and nothing else.
   It never prints and never exports: print media hides it, ITSheet's clone drops it, and the Review
   preview clones (#finRealWrap, #ceFinRealWrap) hide it below. */
.it-logo-add{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;
  width:var(--it-logo-size,52px)!important;height:var(--it-logo-size,52px)!important;min-width:0!important;min-height:0!important;
  padding:0!important;margin:0 0 12px;border:1.5px dashed currentColor!important;border-radius:12px!important;
  background:transparent!important;box-shadow:none!important;color:inherit;opacity:.55;cursor:pointer;
  font:inherit;line-height:0;text-transform:none;letter-spacing:0;transition:opacity .15s,background-color .15s}
.it-logo-add[hidden],body #paper .it-logo-add[hidden],body .it-logo-add.it-logo-add[hidden]{display:none!important}
body #paper .it-logo-add:not([hidden]){display:inline-flex!important}
.it-logo-add:hover,.it-logo-add:focus-visible,.it-logo-add.is-drag{opacity:1;background:rgba(127,127,127,.12)!important}
.it-logo-add:focus-visible{outline:2px solid currentColor;outline-offset:2px}
.it-logo-add svg{display:block;width:calc(var(--it-logo-size,52px) * .42);height:calc(var(--it-logo-size,52px) * .42);
  stroke:currentColor;fill:none;stroke-width:1.8;pointer-events:none;padding:0;background:none;border-radius:0}
.it-logo-img{cursor:pointer}
.it-logo-img.is-drag{outline:2px dashed currentColor;outline-offset:3px}
.it-logo-x{position:absolute;z-index:6;width:22px;height:22px;box-sizing:border-box;padding:0;border:0;border-radius:50%;
  background:#1A1713;color:#fff;font:700 15px/22px Inter,system-ui,sans-serif;text-align:center;cursor:pointer;
  box-shadow:0 1px 4px rgba(0,0,0,.35);opacity:0;pointer-events:none;transition:opacity .12s}
.it-logo-x.on{opacity:1;pointer-events:auto}
.it-logo-x:focus-visible{opacity:1;outline:2px solid #fff;outline-offset:1px}
@media (hover:none){.it-logo-x.on{opacity:1}}
@media print{html body #paper .it-logo-add:not([hidden]),html body .it-logo-add,html body .it-logo-x{display:none!important}}
#finRealWrap .it-logo-add,#finRealWrap .it-logo-x,#ceFinRealWrap .it-logo-add,#ceFinRealWrap .it-logo-x,
.fin-real .it-logo-add,.fin-real .it-logo-x{display:none!important}
.inv-logo.it-logo-add{--it-logo-size:40px;max-height:none;max-width:none}
/* designs that hide their logo area: the spot and an uploaded logo still show */
body .it-logo-force.it-logo-force.it-logo-force.it-logo-force.it-logo-force.it-logo-add{display:inline-flex!important}
body .it-logo-force.it-logo-force.it-logo-force.it-logo-force.it-logo-force.it-logo-img{display:block!important}
#invoicePreview.invoice-preview .inv-logo.it-logo-force.it-logo-force.it-logo-add{display:inline-flex!important}
#invoicePreview.invoice-preview .inv-logo.it-logo-force.it-logo-force.it-logo-img{display:block!important}
/* a thumb-sized hit area around the spot even when the sheet is scaled down on a phone */
.it-logo-add{position:relative}
.it-logo-add::before{content:"";position:absolute;inset:-14px}
/* print always wins, including over the force rules above */
@media print{html body .it-logo-add.it-logo-add.it-logo-add.it-logo-add.it-logo-add.it-logo-add.it-logo-add,
html body #invoicePreview.invoice-preview .inv-logo.it-logo-add.it-logo-add.it-logo-add.it-logo-add.it-logo-add,
html body .it-logo-x.it-logo-x{display:none!important}}
/* a design's decorative layer (a ::before/::after on the sheet, its header or its id block) can sit over the
empty spot and swallow the click (account-statement uni03/13/24/31/38/39, packing-slip and timesheet uni02/uni27,
cost-estimator uni40). Decoration never takes a click there, so it passes through to the spot; looks unchanged. */
.paper:has(.it-logo-add:not([hidden]))::before,.paper:has(.it-logo-add:not([hidden]))::after,
.p-top:has(.it-logo-add:not([hidden]))::before,.p-top:has(.it-logo-add:not([hidden]))::after,
.p-top-r:has(.it-logo-add:not([hidden]))::before,.p-top-r:has(.it-logo-add:not([hidden]))::after,
.ce-doc:has(.it-logo-add:not([hidden]))::before,.ce-doc:has(.it-logo-add:not([hidden]))::after,
.ce-doc-h:has(.it-logo-add:not([hidden]))::before,.ce-doc-h:has(.it-logo-add:not([hidden]))::after,
.ce-doc-id:has(.it-logo-add:not([hidden]))::before,.ce-doc-id:has(.it-logo-add:not([hidden]))::after{pointer-events:none!important}
/* 14 Oct 2026: a wide logo must not be clipped by a theme's circular or fixed badge frame on the quote sheet. */
#live-preview-capture [data-f="business.logo"][data-wide="1"]{border-radius:10px!important}
/* 14 Oct 2026: the upload glyph is always centered in the box on every design. Some designs restyle the box
(display:block, padding, text-align) with id-level selectors and push the glyph toward a corner. Screen only, so the
print rules above keep hiding the box. :is(#it-nx,body) lifts specificity to id level without needing a real id. */
@media screen{
html :is(#it-nx,body) .it-logo-add.it-logo-add.it-logo-add.it-logo-add.it-logo-add:not([hidden]){display:inline-flex!important;
  align-items:center!important;justify-content:center!important;text-align:center!important;text-indent:0!important;
  padding:0!important;line-height:0!important;flex-direction:row!important}
html :is(#it-nx,body) .it-logo-add.it-logo-add.it-logo-add.it-logo-add.it-logo-add:not([hidden]) svg{margin:0!important;flex:none!important;
  position:static!important;transform:none!important;inset:auto!important;float:none!important;vertical-align:middle}
}