/*
 * Client logos (1.4.5): the logo, or the initials tile, beside a client's
 * name; linked on every admin and portal page by hooks/client_logo.php.
 * A white tile with a hairline border, so a dark logo and a light one sit
 * the same way on any background.
 */
.ee-clogo { display: inline-grid; place-items: center; flex: none; box-sizing: border-box; width: 22px; height: 22px; border-radius: 6px; border: 1px solid rgb(var(--ee-border, 226 232 240)); background: rgb(var(--ee-border-soft, 241 245 249)); color: rgb(var(--ee-text, 71 85 105)); font-size: 10px; font-weight: 600; line-height: 1; letter-spacing: .02em; vertical-align: middle; overflow: hidden; }
img.ee-clogo { background: rgb(var(--ee-surface, 255 255 255)); object-fit: contain; padding: 2px; }
.ee-clogo--xs { width: 18px; height: 18px; border-radius: 5px; font-size: 8px; }
.ee-clogo--xs.ee-clogo--img { padding: 1px; }
.ee-clogo--md { width: 28px; height: 28px; border-radius: 7px; font-size: 11px; }
.ee-clogo--lg { width: 40px; height: 40px; border-radius: 9px; font-size: 14px; }
.ee-clogo--lg.ee-clogo--img { padding: 3px; }

/* Logo and name in a heading or a row. */
.ee-clogo-name { display: inline-flex; align-items: center; gap: 8px; min-width: 0; max-width: 100%; vertical-align: middle; }
.ee-clogo-name > span, .ee-clogo-name > a { min-width: 0; overflow: hidden; text-overflow: ellipsis; }

/* Customers list: the logo beside the company cell, row options under the name. */
.ee-clogo-cell { display: flex; align-items: flex-start; gap: 10px; }
.ee-clogo-cell > .ee-clogo { margin-top: 1px; }

/* The Profile tab's Logo row. */
.ee-clogo-field__row { display: flex; align-items: flex-start; gap: 12px; }
.ee-clogo-field__body { min-width: 0; }
.ee-clogo-field__acts { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.ee-clogo-field .ee-hp-wrap { margin-left: 6px; }

/* A page title with the logo before it (portal report). */
.ee-hp-titlerow > .ee-clogo { align-self: center; }