/*
 * Laboratory card — Figma "card-lab" (4418:3637).
 *
 * Hover (4418:3635) outlines the card and turns its label pink; the fill does not change. That is
 * the convention of every action tile of the portal — see docs/technique/design-system.md. The
 * transparent border in the default state is what keeps the card from growing by 4px under the
 * pointer.
 */

.mo-card-lab {
    display: flex;
    height: 100%;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: calc(var(--mo-spacing-sm) - var(--mo-border-width-xs));
    border: var(--mo-border-width-xs) solid transparent;
    border-radius: var(--mo-radius-md);
    background-color: var(--mo-surface-default-white);
    color: inherit;
    text-decoration: none;
    transition: border-color 120ms ease, color 120ms ease;
}

.mo-card-lab:hover,
.mo-card-lab:focus-visible {
    border-color: var(--mo-border-action);
}

.mo-card-lab:hover .mo-card-lab__name,
.mo-card-lab:focus-visible .mo-card-lab__name {
    color: var(--mo-text-action);
}

.mo-card-lab__logo {
    display: block;
    width: 100%;
    height: 100px;
    object-fit: contain;
}

.mo-card-lab__name {
    color: var(--mo-text-heading);
    font-size: var(--mo-font-size-h4);
    font-weight: var(--mo-font-weight-bold);
    line-height: var(--mo-line-height-h4);
    text-align: center;
    text-wrap: balance;
}