#nexahrApp {
    --uhr-navy: var(--v0-navy, var(--ui-theme-sidebar-top, #111638));
}

.uhr-file {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    max-width: min(360px, 100%);
    min-width: 0;
    vertical-align: middle;
}

.uhr-file-input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.uhr-file-button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 36px;
    padding: 0 12px;
    border-radius: 8px;
    border: 1px solid color-mix(in srgb, var(--uhr-navy) 28%, #d0d5dd);
    background: #fff;
    color: var(--uhr-navy);
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    flex: 0 0 auto;
}

#nexahrApp .uhr-file-button.primary {
    background: #1f5fa8;
    border-color: #1f5fa8;
    color: #fff;
    min-height: 36px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
}

.uhr-file-button:hover {
    background: color-mix(in srgb, var(--uhr-navy) 8%, #fff);
}

#nexahrApp .uhr-file-button.primary:hover,
#nexahrApp .uhr-file-button.primary:focus-visible {
    background: #184d8a;
    border-color: #184d8a;
    color: #fff;
}

.uhr-file-input:focus-visible + .uhr-file-button {
    outline: 2px solid #7da5d3;
    outline-offset: 2px;
}

.uhr-file-input:disabled + .uhr-file-button {
    opacity: .55;
    cursor: not-allowed;
}

.uhr-file-icon {
    width: 14px;
    height: 14px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='black' d='M8 11.5V3.4L5.7 5.7 4.6 4.6 8 .2l3.4 4.4-1.1 1.1L8 3.4v8.1zM3 12.2h10V14H3z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='black' d='M8 11.5V3.4L5.7 5.7 4.6 4.6 8 .2l3.4 4.4-1.1 1.1L8 3.4v8.1zM3 12.2h10V14H3z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.uhr-file-name {
    min-width: 0;
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #475467;
    font-size: 13px;
}
