:root {
    --home-location-height: var(--control-h-m);
    --block-header-total-height: calc(var(--server-subheader-height) + var(--main-header-height) + var(--home-location-height));
}
.home-location-subheader {
    position: absolute;
    top: calc(var(--server-subheader-height) + var(--main-header-height));
    inset-inline: 0;
    height: var(--home-location-height);
    z-index: calc(var(--z-header, 50) - 1);
    color: var(--block-text-on-dark-solid);
    font-size: var(--fs-sm);
}
.home-location-inner {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    height: 100%;
    width: 100%;
    max-width: var(--main-header-max-width);
    min-width: 0;
    margin-inline: auto;
    padding-inline: var(--block-page-inline-padding);
}
.home-location-area {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.home-location-weather {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    flex: none;
    white-space: nowrap;
    font-size: var(--fs-xs);
    color: inherit;
    text-decoration: none;
}
.home-location-weather:hover {
    color: inherit;
    text-decoration: underline;
}
.home-location-weather .hz-icon {
    font-size: var(--control-icon-s);
}
.home-location-subheader [hidden] { display: none; }
.home-location-refresh {
    flex: none;
    width: var(--control-h-s);
    height: var(--control-h-s);
    color: var(--block-text-on-dark-solid);
}
.home-location-refresh:not(:disabled):hover {
    color: var(--block-text-on-dark-solid);
    background: var(--block-surface-hover);
}