/* Tile icon well — shared by the dashboard tiles (hub/home.html) and the
 * header tool search's palette rows, which base.html renders on every hub
 * portal page (components/service_tile_icon.html). Loaded by base.html. */

.hub-home__tile-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: var(--radius-control);
    font-size: var(--fs-20);
}

.hub-home__tile-icon img {
    width: 60%;
    height: 60%;
    object-fit: contain;
}

/* ITS Hub icon set: neutral well, the SVG carries its own grey + blue.
 * Each tile ships both variants; the theme shows one. */
.hub-home__tile-icon--logo {
    background: var(--bg);
    border: 1px solid var(--border);
}

.hub-home__tile-icon .hub-home__tile-logo {
    width: 64%;
    height: 64%;
}

.hub-home__tile-logo--dark,
[data-theme="dark"] .hub-home__tile-logo--light {
    display: none;
}

[data-theme="dark"] .hub-home__tile-logo--dark {
    display: block;
}

.hub-home__tile-icon-monogram {
    font-family: var(--font-nav);
    font-weight: var(--fw-semibold);
    font-size: var(--fs-16);
    line-height: var(--lh-tight);
}

/* The palette rows reuse the tile icon well at the palette's 34px mark size. */
.its-palette__mark .hub-home__tile-icon {
    width: 100%;
    height: 100%;
    font-size: var(--fs-16);
}

.its-palette__mark .hub-home__tile-icon-monogram {
    font-size: var(--fs-14);
}