/* E-SALES logo sizing — shared by every page that shows the mark.
   (Saad 2026-08-20: "use original logo dont do any croppinng")

   /assets/esales-logo.png is Saad's ORIGINAL file, byte for byte. In it the
   wordmark sits centred on a 1080x1080 canvas with wide transparent margins:
   the artwork is 632x172, padded 224 left/right and 454 top/bottom. Sized the
   obvious way — height:100% inside a 50px chip — the square canvas scales to
   50px and the wordmark inside renders about 8px tall, which is why an earlier
   build shipped a trimmed copy of the file instead.

   This keeps the file untouched and fixes it in CSS: the same image is painted
   as a background at 628% (1080/172) of the box height, so the WORDMARK — not
   the canvas — exactly fills the box. Everything falling outside the box is
   transparent padding, so no part of the artwork is ever cropped. The <img> is
   swapped for a transparent 1x1 so it stops painting the unscaled version
   underneath; its src is kept so each page's existing onerror fallback still
   fires if the real file ever goes missing.

   [src] is repeated in the selector purely to outrank each page's own
   `.logo-chip img { height:100% }` rule without resorting to !important. */
img[src*="esales-logo"][src]{
  display:block;
  height:100%;
  width:auto;
  max-width:none;
  aspect-ratio:632 / 172;
  content:url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
  background:url("/assets/esales-logo.png?v=2") center center / auto 628% no-repeat;
}

/* No box behind the mark (Saad 2026-08-20: "dont include this black box
   around the logo").

   Each page wraps the logo in a dark chip — background:#080808 plus a border
   and a drop shadow. This strips that wherever the logo sits, without editing
   19 separate inline stylesheets. Padding is deliberately left alone so the
   mark keeps exactly the size it has now and only the black rectangle goes.

   HEADS UP: the artwork is two-tone. "E-SALES" is gold (#d1aa67) but "BY MGC"
   underneath it is pure WHITE, which is why the dark chip existed. With the
   chip gone, "BY MGC" is invisible against the light theme background. Fixing
   that properly needs a light-background version of the logo (dark or gold
   "BY MGC" instead of white) — it cannot be corrected in CSS without
   recolouring the supplied artwork. */
.logo-chip:has(img[src*="esales-logo"]),
.logo:has(img[src*="esales-logo"]),
.brand-logo:has(img[src*="esales-logo"]),
.top:has(> img[src*="esales-logo"]){
  background:none !important;
  border:0 !important;
  box-shadow:none !important;
  min-width:0 !important;
}
